ClientID inside of ASCX file - javascript

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);" />

Related

How do I call method from CodeFile using Bootstrap (C#, VS 2013)

I'm using VS 2013 to develop an aspx page with a C# CodeFile. If I've used Bootstrap on the aspx page how do I reference the CodeFile to call a function. On a button click, for example. This gets handled by a Button1_Click function in the CodeFile:
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
But how can I do the same using a Bootstrap button?
<button type="button" class="btn btn-default" id="Button1">Button1</button>
You cannot do this this as the callback requires a server-side control. If your goal is to style you <asp:Button> control, you can set the CssClass property to "btn btn-default" like in your HTML.
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" CssClass="btn btn-default" />
In you Page or Control definition, you will also need to set the class that contains your Button1_Click method as the Inherits property.

When page loaded Checkbox only check one time ? ASP.NET ,C#

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>

Not getting ClientID in ASP.Net

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>

Get the properties of an asp.button function in a javascript function

I would like to know how I can get the properties of an asp:Button from a javascript function.
Specifically I want to be able to test whether a specific aspx button is enabled or not in a javascript function.
Once you know the client ID of the <asp:Button /> you can use document.getElementById function to get the reference of it's DOM object and get other properties you are interested in.
An example:
Some where in aspx mark up:
<asp:Button id="button1" runat="server" Text="Click Me"/>
In javascript:
<script type="text/javascript">
//button1 is the ID of asp:Button
var objButton = document.getElementById('<%=button1.ClientID');
</script>
You do this like you would with a plain html button.
<asp:Button id="foo" runat="server" />
Turns into
<input type="button" id="foo" />
If youre using a new version of asp.net, you can add ClientIDMode="Static" so that the id doesnt change to something else.

<input type="button" runat="server" /> won't work in ASP.NET

Okay, this may seem silly, but on an ASP.NET .ascx control, I'm trying to use:
<input type="button" runat="server" />
instead of:
<asp:Button runat="server" />
And it's not working for me. This code:
<asp:Button id="btnBuyCat" runat="server" Text="Buy Cat"
ToolTip="Click to buy a cat" OnClick="btnBuyCat_Click" EnableViewState="false" />
renders the following HTML: (ignoring naming containers btw)
<input type="submit" id="btnBuyCat" name="btnBuyCat" value="Shopping Cart"
title="Click to buy a cat" />
That's mostly fine, except I want input type="button" not input type="submit".
I tried this code:
<input type="button" id="btnBuyCat" name="btnBuyCat" runat="server"
value="Buy Cat" title="Click to buy a cat" onclick="btnBuyCat_Click"
enableviewstate="False" />
and get this HTML:
<input type="button" id="btnBuyCat" name="btnBuyCat"" value="Buy Cat"
title="Click to buy a cat" onclick="btnBuyCat_Click" />
Unfortunately the rendered button does not work. Also, I even tried input type="submit" just to check, but unless I use the <asp:Button> I can't get it to work. I'm sure it has something to do with the JavaScript.
Is there a way to use the regular HTML button markup and a runat="server" in ASP.NET?
What you're missing is the UseSubmitBehavior attribute, e.g.,
<asp:Button id="btnBuyCat" runat="server" Text="Buy Cat"
UseSubmitBehavior="False" ToolTip="Click to buy a cat"
OnClick="btnBuyCat_Click" EnableViewState="false" />
This will give you a regular button, not a submit button.
To specify an input control runat=server, you must also specify an id. Also the error you get is probably because of js error. onclick event on a standard html control is assuming a script method define, whereas it seems like you wanted to do a postback type operation. Your option is to define a javascript function according to the method name you give to the onclick event, or use __doPostBack method to explicitly trigger postback
<input type="button" runat="server" id="btnTest" />
Have you tried:
<button type="button" id="btnBuyCat" name="btnBuyCat" value="Shopping Cart"
title="Click to buy a cat" onclick="btnBuyCat_Click">Click Me!</button>
You can use:
btnBuyCat.ServerClick += new EventHandler(btnBuyCat_ServerClick);

Categories