I have ASP.Net page where i am calling a JavaScript function like this:
Enter server name: <asp:TextBox ID="txt_name" runat="server"></asp:TextBox>
<asp:Button ID="btn_view" runat="server" OnClick="View_btn_click" OnClientClick="return AlertOnGo('View Configuration',document.getElementById('<%= txt_name.ClientID %>').value)" Text ="GO!" />
But on clicking the GO button, i am getting the following error:
JavaScript runtime error: Unable to get property 'value' of undefined or null reference
On viewing the rendered code for the button:
<input type="submit" name="btn_view" value="GO!" onclick="return AlertOnGo('View Configuration',document.getElementById('<%= txt_name.ClientID %>').value);" id="btn_view" />
It is not putting the appropriate ClientID. I tried setting the CLientIDMode to static for the test box, yet no help.
This question is similar to this unanswered question.
There are a few solutions to this problem.
One of the simpler would be to move the name into a JavaScript variable since the problem only occurs within the control when trying to evaluate txt_name.ClientID inside the OnClientClick attribute of an ASP.NET control.
<script>
var txtName = '<%= txt_name.ClientID %>';
</script>
Enter server name: <asp:TextBox ID="txt_name" runat="server"></asp:TextBox>
<asp:Button ID="btn_view" runat="server" OnClick="View_btn_click"
OnClientClick="return AlertOnGo('View Configuration',
document.getElementById(txtName).value)" Text ="GO!" />
you can use the property ClientIDMode="Static" inside the asp:textbox tag
like this
<asp:TextBox ClientIDMode="Static" ID="txt_name" runat="server"></asp:TextBox>
<asp:Button ID="btn_view" runat="server" OnClick="View_btn_click"
OnClientClick="return AlertOnGo('View Configuration',
document.getElementById(txtName).value)" Text ="GO!" />
this way the client id of the text box would be same as the "id" and you can use
document.getElementById('txt_name').value
and it works for me
Youre using <%= %> in the property of an asp.net web control - I wouldnt expect that to work, since the whole control will be replaced by html.
I would move your javascript out into a script block and attach the event handler in code rather than putting it all inline.
Enter server name: <asp:TextBox ID="txt_name" runat="server"></asp:TextBox>
<asp:Button ID="btn_view" runat="server" OnClick="View_btn_click" Text ="GO!" />
<script>
document.getElementById('<%= btn_view.ClientID %>').attachEvent('click', function() {
return AlertOnGo('View Configuration',
document.getElementById('<%= txt_name.ClientID %>').value);
});
</script>
-- edited answer --
aspx
<asp:Button ID="btn_view" runat="server" OnClick="View_btn_click" OnClientClick="javascript:return AlertOnGo('View Configuration');" Text ="GO!" />
script
function AlertOnGo(mode)
{
var btnId = '<%= txt_name.ClientID %>';
var value=document.getElementById(btnId).value;
//your code
return false;
}
I prefer to use String.Concat. You can use \u0027 instead of apostrophe.
OnClientClick='<%#String.Concat("document.getElementById(\u0027", AddToCartBtn.ClientID.ToString(), "\u0027).value = \u0027Adding...\u0027;")%>'
Another solution is you can go to browser do insect element read the dynamic Id of textbox and set that in javascript like:
var ddlFunction = document.getElementById('ctl00_SPWebPartManager1_g_ecede3f6_2b87_405a_af1b_70401bb8d4c7_ddlFunction');
Html:
<asp:DropDownList ID="ddlFunction" runat="server" CssClass="dropDownClass">
<asp:ListItem Selected="True">Select One</asp:ListItem>
<asp:ListItem>Sample 1</asp:ListItem>
<asp:ListItem>Sample 2</asp:ListItem>
</asp:DropDownList>
You can create a css class and use that instead of client id, (with jQuery $('.txt_name').text()):
Enter server name:
<asp:TextBox ID="txt_name" CssClass="txt_name" runat="server"></asp:TextBox>
Related
I have a textbox and a button in my code.The button when clicked should validate the value entered in the textbox.The button most of the times does it but at times doesn't do anything at all.Any help would be appreciated.
<asp:Button ValidationGroup="vgpPno" runat="server" ID="btnSubmitPartNumber" OnClick="btnSubmitPartNumber_Click" SkinID="MSWButton" Text="OK" OnClientClick="if(Page_ClientValidate(){startPLI();}meta:resourcekey="btnSubmitPartNumberResource1" />
<asp:TextBox runat="server" ValidationGroup="vgpPno" SkinID="MSWTextBox"
ID="tbPARTNUMBER" MaxLength="11" meta:resourcekey="tbPARTNUMBERResource1" Width="230" Style="display: inline" CssClass="form-control input-sm"></asp:TextBox>
<asp:Button ValidationGroup="vgpPno" runat="server" ID="btnSubmitPartNumber" OnClick="btnSubmitPartNumber_Click" SkinID="MSWButton" Text="OK"
OnClientClick="if(Page_ClientValidate(){startPLI();}meta:resourcekey='btnSubmitPartNumberResource1'" />
Check Your web Form. If you are using form tag more then one time asp.controls not working properly
My simple question is that ,is there any method/way in which 'Checbox' only check one time.I mean when page loaded which contains 'checkbox' ,after page loaded then i select check box and press 'button' then checkbox will be disabled,only one time checkbox will tick.Is there any way?
Thanks.
here is my code :
<label>Allow Null <asp:CheckBox ID="Null" runat="server" /></label>
<label>Primary Key <asp:CheckBox ID="Primary" runat="server" />
<br />
<asp:Button ID="Button1" ValidationGroup="s" onclick="Button1_Click" runat="server" Text="Insert" />
I want when i press "Insert" button then primary checkbox(check its tick or not),if Primary cehckbox tick then next time this will be disabled.Only one time "Primary" checkbox tick.
As the coments suggests ,
from client script you can try this:
$("#checkId").attr("disabled", true);
if you are in asp.net web-forms and the button does postback then you can even disable it from code behind.
Edit
<label>Allow Null <asp:CheckBox ID="Null" runat="server" ClientIdMode="Static" /></label>
<asp:Button ID="Button1" ValidationGroup="s" onclick="Button1_Click" runat="server" OnClientClick="UpdateCheck();" Text="Insert" />
<script>
function updateCheck(){
$("#Null").attr("disabled", true);
}
</script>
I have a asp.net web page which contains many textboxes.
If any of these boxes I run some javascript via the onchange event of each field.
The javascript basically changes a textbox to 'Y' so I know which section of the page has changed something.
Everything works fine, however I just need to know if there is a way of making the onchange call better/shorter ? Since I have over >100 textboxes, there is a lot of repetitive onchange='CM('3'); on each and every textbox, so I am hoping there is a better way to handle this.
There are three divs, each containing some 35 textboxes, so perhaps there is a way of doing it by DIV, which I don't know.
Any guidance is appreciated.
<asp:TextBox ID="txtDC1_D" runat="server" CssClass="STD_desc160" onchange="CM('3');"></asp:TextBox>
<asp:TextBox ID="txtDC1_C" runat="server" CssClass="STD_cur30" onchange="CM('3');"></asp:TextBox>
<asp:TextBox ID="txtDC1_1" runat="server" CssClass="STD_value55" onchange="CM('3');"></asp:TextBox>
<asp:TextBox ID="txtDC1_2" runat="server" cssClass="STD_value55" onchange="CM('3');"></asp:TextBox>
<asp:TextBox ID="txtDC1_3" runat="server" cssClass="STD_value55" onchange="CM('3');"></asp:TextBox>
<asp:TextBox ID="txtDC1_B" runat="server" CssClass="STD_bassis" onchange="CM('3');"></asp:TextBox>
<br />
<asp:TextBox ID="txtDC2_D" runat="server" CssClass="STD_desc160" onchange="CM('2');"></asp:TextBox>
<asp:TextBox ID="txtDC2_C" runat="server" CssClass="STD_cur30" onchange="CM('2');"></asp:TextBox>
<asp:TextBox ID="txtDC2_1" runat="server" CssClass="STD_value55" onchange="CM('2');" ></asp:TextBox>
<asp:TextBox ID="txtDC2_2" runat="server" cssClass="STD_value55" onchange="CM('2');" ></asp:TextBox>
<asp:TextBox ID="txtDC2_3" runat="server" cssClass="STD_value55" onchange="CM('2');" ></asp:TextBox>
<asp:TextBox ID="txtDC2_B" runat="server" CssClass="STD_bassis" onchange="CM('2');"></asp:TextBox>
<br />
If jQuery is also an option ( which I strongly recommend) , so :
$(function (){
$("input[type=text]").on('change',function (){
if ($(this).val()) $(this).val('Y'); else $(this).val('');
})
});
if not , I will delete this answer.
i have a page which i do some validations , all my validations are client side expected one which it use server validation. So my problem is when i fire the server side validation and the page postbacks, this function Page_ClientValidate('mygroup') return true, so i lose my validation though my required fields aren't.
function DoValidation() { var validated = Page_ClientValidate('NewMemberRequired'); Page_BlockSubmit = false; return validated; }
<telerik:RadButton ID="btnSave" runat="server" Text="Save & Close" OnClick="btnSave_Click" CausesValidation="true"
OnClientClick="return DoValidation();">
//the fields
<asp:RequiredFieldValidator ID="AddressRequired" runat="server" ControlToValidate="Address"
CssClass="ErrorMessage" ErrorMessage="Required"ValidationGroup="mygroup"><asp:RequiredFieldValidator/>
//an other filed with postback=true
<telerik:RadTextBox ID="age" runat="server" AutoPostBack="True" OnTextChanged="age_TextChanged">
read the documentation on using RadButton's client-side events as your approach will not work even if it does not cause errors: http://www.telerik.com/help/aspnet-ajax/button-onclientclicking.html. This can also help: http://blogs.telerik.com/aspnet-ajax/posts/12-08-10/migrating-onclientclick-handlers-from-asp-button-to-telerik-s-asp-net-ajax-button.aspx
Read the documentation on executing custom validation: http://www.telerik.com/help/aspnet-ajax/button-validation-with-postback-confirm.html
Make sure your validation grops are fine because in the provided snippet they do not match
the AutoPostBack=true for a textbox will have it postback when you delete its text, regardless of the validator in this setup
Here is some code that validates well:
<telerik:RadButton ID="btnSave" runat="server" Text="Save & Close" OnClick="btnSave_Click" CausesValidation="true"
OnClientClicking="DoValidation">
</telerik:RadButton>
//the fields
<asp:RequiredFieldValidator ID="AddressRequired" runat="server" ControlToValidate="Address"
CssClass="ErrorMessage" ErrorMessage="Required" ValidationGroup="mygroup">
</asp:RequiredFieldValidator>
//an other filed with postback=true
<telerik:RadTextBox ID="Address" runat="server" AutoPostBack="True" OnTextChanged="age_TextChanged" ValidationGroup="mygroup" CausesValidation="true">
</telerik:RadTextBox>
<script>
function DoValidation(sender, args) {
var validated = Page_ClientValidate('mygroup');
args.set_cancel(!validated);
Page_BlockSubmit = false;
}
</script>
Changes:
proper use of OnClientClicking event
proper ValidationGroups being set
CausesValidation=true for the etxtbox so deleting its text will cause validation and prevent the postback
I am trying to get CLientID inside the .ascx (user control mark-up) file.
While this
My id is: <%=this.ClientID%>
renders as
My id is: fracTemplateCtrl
This:
<asp:Button ID="btnSave" runat="server" Text="Save Template" onclick="btnSave_Click" OnClientClick="return confirmSave('<%=this.ClientID%>');" />
renders as (inside Source code):
<input type="submit" name="fracTemplateCtrl$btnSave" value="Save Template" onclick="return confirmSave('<%=this.ClientID%>');" id="fracTemplateCtrl_btnSave" />
Clearly, ClientId property does not get evaluated in the second case. How do I overcome this issue? (aside from hardcoding, which is not the answer, I would like to make the user control independent)
You could set the OnClientClick property's value server-side like this:
btnSave.OnClientClick = "return confirmSave('" + this.ClientID + "')";
Try this instead
<asp:Button ID="btnSave" runat="server" Text="Save Template" onclick="btnSave_Click" OnClientClick="return confirmSave(this.id);" />