In the below code i have coded in page load.In this i have store regular expressions in hidRegExp.Value. Now i have to store this value in the hidden field.Now in javascript i have to validate the user input in textbox.But when i enter a value it shows blank alert.But i want to display the regular expression in alert.Pls help me to do this.
code behind:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (FieldTypeInfo == FieldType.TextBox)
{
TblSearch.Visible = false;
TblDate.Visible = false;
tblDropd.Visible = false;
TblChk.Visible = false;
lblText.Text = FieldLabel;
//txtreq.Enabled = this.IsMandatory;
string strRegularExp = string.Empty;
if (ListOfRegularExpression != null)
{
for (int iRow = 0; iRow < ListOfRegularExpression.Count; iRow++)
{
strRegularExp += ListOfRegularExpression[iRow].ToString() + "~~";
hidRegExp.Value = strRegularExp;
if (iRow == ListOfRegularExpression.Count - 1)
{
strRegularExp = strRegularExp.TrimEnd("~~".ToCharArray());
txtField.Attributes.Add("onblur", "javascript:ValidateRegExp('" + txtField.ToString() + "');");
}
}
}
hidRegExp.Value = strRegularExp;
lbl.Text = "The value of the HiddenField control is " + hidRegExp.Value + ".";
}}
code:
<script type="text/javascript">
function ValidateRegExp(txtInput) {
var hiddenValue = document.getElementById("<%=hidRegExp.ClientID%>").value;
alert("hiddenValue" + hiddenValue+".");
var mySplitResult = new Array();
mySplitResult = hiddenValue.split("~~");
for (i = 0; i < mySplitResult.length; i++) {
//document.write("<br /> Array[" + i + " ]= " + mySplitResult[i]);
var re = new RegExp(mySplitResult[i]);
if (txtInput.match(re)) {
alert("Successful match");
} else {
alert("No match");
}
}
}
</script>
<asp:HiddenField ID="hidRegExp" runat="server" EnableViewState= "true" >
</asp:HiddenField >
<asp:Label ID="lbl" runat="server"></asp:Label>
Initially ListOfRegularExpression will be null so control will not enter into if (ListOfRegularExpression != null) and HiddenField.Value wont be set.
I have had the problem before. Honestly, I don't remember how I resolved it, but I tried a few things. Here they are:
For displaying the hidden field, add ClientIdMode as static on your hidden field like
<asp:HiddenField ID="hidRegExp" runat="server" EnableViewState="true" ClientIDMode="Static"></asp:HiddenField>
and in the JavaScript, use:
document.getElementById("hidRegExp");
If this does not work, try your approach with these below:
1) Try moving your hidden field before the script.
2) Try making it a label and use that in the JavaScript.
Hope this helps.
Related
When I click the update button, aspxlistbox is filled by codebehind. When I print firm code to AspxTextbox4, the firm code of the firm name is displayed in the second aspxtextbox. In order to do that, I use the lostfocus event of AspxTextbox4.
However, aspxlistbox resets all data. This is an unexpected issue for me. How can I cope with that?
This is my Asp code.
<dx:ASPxTextBox ID="ASPxTextBox4" runat="server" Width="100%"
ClientInstanceName="textbox_firmcode" AutoPostBack="false" EnableClientSideAPI="true">
<ClientSideEvents LostFocus="getFirmName" />
</dx:ASPxTextBox>
<dx:ASPxButton ID="ASPxButton4" runat="server" Text="Add" Width="100%" AutoPostBack="False">
<ClientSideEvents Click="addListClick" />
</dx:ASPxButton>
<dx:ASPxListBox ID="ASPxListBox1" runat="server" Width="100%" ClientInstanceName="ASPxListBox1"> </dx:ASPxListBox>
This is the Javascript code below.
function getFirmName(s, e) {
devpopup.PerformCallback('firmtxt|' + s.GetText());
}
function addListClick(s, e) {
var firmcode = textbox_firmcode.GetText();
var firmname = textbox_firmname.GetText();
var st = 0;
for (var i = 0; i < ASPxListBox1.GetItemCount() ; i++) {
var item = ASPxListBox1.GetItem(i);
if (item.value.split(' ')[0] == firmcode) st = 1;
}
if (st == 0) {
ASPxListBox1.BeginUpdate();
ASPxListBox1.AddItem(firmcode + ' ' + firmname);
ASPxListBox1.EndUpdate();
listcount++;
}
return false;
}
The last one is the codebehind C#
protected void devpopup_WindowCallback(object source, PopupWindowCallbackArgs e)
{
string[] data = e.Parameter.Split('|');
if(data[0].Equals("firmtxt"))
{
ASPxPageControl page = (ASPxPageControl)((ASPxPopupControl)source).FindControl("ASPxPageControl1");
ASPxRoundPanel rpanel = (ASPxRoundPanel)page.FindControl("ASPxRoundPanel2");
ASPxTextBox txtbox = (ASPxTextBox)rpanel.FindControl("ASPxTextBox5");
ASPxRoundPanel otherpanel = (ASPxRoundPanel)page.FindControl("ASPxRoundPanel2");
ASPxListBox firmlistbox = (ASPxListBox)otherpanel.FindControl("ASPxListBox1");
SFADatabase db = new SFADatabase(Server);
string[] frmname = db.getData("SFA_FIRM", new string[] { "FRMNAME" }, "WHERE FRMCODE='" + data[1] + "'");
if (frmname.Length > 0)
{
txtbox.Text = frmname[0];
txtbox.Focus();
//txtbox.Enabled = false;
}
else
{
//txtbox.Enabled = true;
txtbox.Text = "";
txtbox.Focus();
}
}
}
public void putUpdateData(string parameter, object source)
{
// Load the firm name to the listbox with update button
columns = new string[] { "FRMCODE", "FRMNAME" };
data = db.getData(SFADatabase.TABLE_FIRM, columns, "WHERE UGRREF=" + group_id + "");
// firmlistbox.Items.Clear();
firmcodelist.Clear();
firmnamelist.Clear();
for (int i = 0; i < SFADatabase.row_count; i++)
{
ListEditItem item = new ListEditItem(data[i * 2] + " " + data[i * 2 + 1], data[i * 2]);
firmlistbox.Items.Insert(i, item);
firmcodelist.Add(data[i * 2]);
firmnamelist.Add(data[i * 2 + 1]);
}
}
I have attached a gif to be more clear.
enter image description here
I have a TextBoxcontrol in my web form, where in I display Height & Width of certain product.
Now I display this as follows :
As you can see, I append a " to show inches, in the string in the following way :
txtH.Text = arrHW[i].ToString() + "\"";
Now, this causes problem while editing! As the user can never always be sure of correctly editing the field by editing the number only and not the " symbol.
I need someway either through JavaScript or C#, that removes the symbol " while the user clicks on the textbox and removes as the focus is changed.
I tried this method, but it doesn't seem to work!
protected void txtH_TextChanged(object sender, EventArgs e)
{
string height = txtH.Text;
char[] splitArr = { '"' };
string[] editH = height.Split(splitArr);
for (int i = 0; i < editH.Length; i++)
{
if (editH[i].ToString().Equals("\""))
{
editH[i].Remove(i);
}
}
}
This is the designer code for the textboxes :
<asp:PlaceHolder ID="plcHW" runat="server">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-arrows-v"></i> Height</span>
<asp:TextBox ID="txtH" runat="server" Width="60px" CssClass="form-control" OnTextChanged="txtH_TextChanged" />
<span class="input-group-addon"><i class="fa fa-arrows-h"></i> Width</span>
<asp:TextBox ID="txtW" runat="server" Width="60px" CssClass="form-control" />
</div>
</asp:PlaceHolder>
You can clear the text box as soon as the focus is on it then add" after the user adds the value to it! This is one way of doing it!
var prev="";
$('#HEIGHT').focus(function() {
prev=$(this).val();
$(this).val(prev.replace("\"", ""));
}).blur(function() {
if($(this).val()==""){
$(this).val(prev)
}
else{
$(this).val($(this).val()+"\"");
}
});
Without any jquery:
(function($el) {
"use strict";
$el.addEventListener("focus", adjust, true);
$el.addEventListener("blur", adjust, true);
function adjust($e) {
var e = $e.type;
if (e === "focus") $el.value = $el.value.replace(/\"/g, "");
if (e === "blur") $el.value = $el.value + '"';
}
})(document.getElementById("height"));
http://jsfiddle.net/dlizik/5cb7g8te/
You can do it as
$(document).ready(function(){
$("TextBoxId").focus(function(){
var tval = $(this).val();
$(this).val(tval.replace(/\"/g, ""));
});
$("TextBoxId").focusout(function(){
var tval = $(this).val();
$(this).val(tval.replace(/\"/g, "")+ '\"');
});
});
I have tried solving your issue with this Fiddle: http://jsfiddle.net/akd7r31a/1/
$(document).ready(function(){
$('#username').focus(function(){
var txtValue = $(this).val();
var charTest = txtValue.substr(txtValue.length - 1);
if(charTest == '"'){
var showString = txtValue.slice(0, -1);
$(this).val(showString);
}
});
$('#username').focusout(function(){
var txtValue = $(this).val();
var charTest = txtValue.substr(txtValue.length - 1);
if(charTest != '"'){
var newVal = $(this).val() + '"';
$(this).val(newVal);
}
});
});
I'm pulling my hair over this, I can't get the Client-Side API of RadDatePicker to work. The object has no function or no properties.My want is simple just want to create a object of a RadDatePicker on javascript.please check the ClearControl function.just want to use set_selectedDate method on find datepicker control object.like:
var today = new Date();
var dateAcc = $find("<%=dtpDODate.ClientID %>");
dateAcc.set_selectedDate(today);
Can you help me to find what is wrong with this code on a blank aspx page?
<script type="text/javascript" language="javascript">
function ClearControl(DivID) {
try {
var elements = null;
if (DivID == null) {
var oForm = document.forms['frmSiteMain'];
if (!oForm) {
oForm = document.form1;
}
elements = oForm.elements;
}
else {
elements = document.getElementById(DivID).getElementsByTagName("input");
}
// oForm.reset();
for (i = 0; i < elements.length; i++) {
if (elements[i].type != null) {
field_type = elements[i].type.toLowerCase();
if (field_type) {
if ((elements[i].id.toString().search("body_") == 0 || elements[i].id.toString().search("ctl00_body_") == 0) && elements[i].id.toString().indexOf("_dtp") > 0) {
var today = new Date();
var control = $find(elements[i].id.toString());
control.set_selectedDate(today);
break;
}
}
}
}
}
catch (e) {
alert(e.message + " Type:" + field_type);
}
}
</script>
<div class="p_div" id="divDODate" runat="server">
<div class="m1">
<asp:Label ID="lblDODate" runat="server" Text="Date"></asp:Label>
<telerik:RadDatePicker ID="dtpDODate" runat="server" MapColumnName="strDODate">
<DateInput ID="DateInput1" DateFormat="MM/dd/yyyy" runat="server">
</DateInput>
</telerik:RadDatePicker>
</div>
</div>
Thanks for your assistance,
The problem is specific , wrong object creation syntax,check the bellow sytax
else if ((elements[i].id.toString().search("body_") == 0 || elements[i].id.toString().search("ctl00_body_") == 0) && elements[i].id.toString().indexOf("_dtp") > 0) {
var today = new Date();//get date
var control = $find(elements[i].id.toString());//create object of date picker control
control.set_selectedDate(today);//fill picker with date.
break;
}
The process is simple:
Type text into a textbox
if the text matches a value in the dropdown list update the value.
If the text does not match a value in the dropdown list do postback using ASP.NET onTextChanged event. (Here lies the problem. The code below currently prevents postback in all instances)
HTML
<asp:DropDownList ID="d" runat="Server" AppendDataBoundItems="true"/>
<asp:TextBox ID="t" runat="Server" AutoPostBack="true" onchange="if(!test(this)) return false;"/>
JQUERY
$(function test() {
var d = ('#<%= d.ClientID%>'),
t = ('#<%= t.ClientID%>');
$(d + ',' + t).on('change', function () {
var val = this.value;
$(d + ' option').each(function () {
if (this.value == val) {
$(d + ',' + t).val(val);
return false;
}
return true;
});
});
});
This code works perfectly for updating the dropdown value.
The problem is this code prevents postback in all cases.
I think the problem is that onchange is fired from textbox and then the subsequent code inside the javascript onchange will not work.
Try javascript:return test() instead of if(!test(this)) return false;, like this
<asp:TextBox ID="t" runat="Server" AutoPostBack="true"
onchange="javascript:return test()"/>
and in JavaScript
function test() {
var d = document.getElementById('d'), t = document.getElementById('t');
var ddl = ('#d');
var txt = ('#t');
var val = t.value;
var len = $(ddl+ ' option[value=' + val + ']').length;
if (len > 0) {
d.value = t.value = val;
return false;
}
return true;
}
Update
Aspx
<asp:DropDownList ID="d" runat="Server" AppendDataBoundItems="true" onchange="javascript:return test('ddl')"/>
<asp:TextBox ID="t" runat="Server" AutoPostBack="true" onchange="javascript:return test('txt')" />
JavaScript
function test(temp) {
var d = document.getElementById('<%= d.ClientID%>'), t = document.getElementById('<%= t.ClientID%>');
var ddl = ('#<%= d.ClientID%>');
var txt = ('#<%= t.ClientID%>');
var val = t.value;
if (temp == "txt") {
var len = $(ddl + ' option[value=' + val + ']').length;
if (len > 0) {
d.value = t.value = val;
return false;
}
}
else {
t.value = d.value;
return false;
}
return true;
}
You can use __doPostBack instead.
post back when drop down list changed:
$(function() {
var d= $('#<%= d.ClientID%>');
d.removeAttr('onchange');
d.change(function(e) {
//You can decide when to post back
setTimeout('__doPostBack("<%= d.ClientID%>","")', 0);
});
});
or post back when textbox changed
$(function() {
var t= $('#<%= t.ClientID%>');
t.removeAttr('onchange');
t.change(function(e) {
setTimeout('__doPostBack("<%= t.ClientID%>","")', 0);
});
});
Per this code below, when users check a box, date is automatically inserted into a textbox control called cDate. This works great:
function ClickBox(cb) {
var tr = cb;
while (tr.tagName != "TR") {
tr = tr.parentNode;
if (tr == null) return; // something went wrong
}
var inps = tr.getElementsByTagName("input");
for (var i = 0; i < inps.length; ++i) {
var inp = inps[i];
if (inp.name.indexOf("cDate") >= 0) {
inp.value = rightDate();
break;
}
}
}
These are the affected controls:
<ItemTemplate>
<asp:CheckBox ID="myrecord" runat="server" onclick="ClickBox(this)" />
</ItemTemplate>
<ItemTemplate>
<asp:TextBox runat="server" style="border: none;" ID="cDate"></asp:TextBox>
</ItemTemplate>
The issue users are currently having is that once a checkbox is checked and date is inserted, only way to remove the inserted dates is the click the Reset button.
They would prefer to have the inserted dates disappear once a checked box is unchecked.
This modified code below isn't working. I am not getting any errors, however, whenever I am checking a box or unchecking it, nothing is happening - no date is getting inserted anymore.
function ClickBox(cb) {
var tr = cb;
var inps = tr.getElementsByTagName("input");
if(cb.checked == 1){ // CheckBox checked condition
while (tr.tagName != "TR") {
tr = tr.parentNode;
if (tr == null) return; // something went wrong
}
for (var i = 0; i < inps.length; ++i) {
var inp = inps[i];
if (inp.name.indexOf("cDate") >= 0) {
inp.value = rightDate();
break;
}
}
}
else{
for (var i = 0; i < inps.length; ++i) {
var inp = inps[i];
inp.value = '';
}
}
}
I am not sure what I am doing wrong.
Thanks for your assistance.
Here's a very simple solution that works for me:
ASP.NET Markup:
<div>
<asp:CheckBox ID="cbDate" runat="server" onclick="ClickBox(this)" />
<br />
<asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
</div>
JavaScript:
function ClickBox(checkbox) {
var dateCheckbox = checkbox;
var dateTextBox = document.getElementById("txtDate");
if (dateCheckbox.checked === true) {
dateTextBox.value = "TODAY";
} else {
dateTextBox.value = "";
}
}
Hope this helps.