ASPNET get ClientID in onchange event using Javascript - javascript

I use:
onchange="alert('<%= AbcControl.ClientID %>')"
but Unfortunately it will translate to:
onchange="alert('<%= AbcControl.ClientID %>')"
May I know what is the best solution for this other than adding the onchange even during server side Page_Load even?
Thanks in Advance.

You can use this.id here
onchange="alert(this.id);"

Try this, if you want to see only Id (Client side generated id) of the AbcControl
<asp:TextBox runat="server" ID="AbcControl" />
<input type="text" onchange='<%= "alert('"+ AbcControl.ClientID +"');" %>' />
OR
Try this, if you want to get the client side object of AbcControl
<asp:TextBox runat="server" ID="AbcControl" />
<input type="text" onchange='<%= "alert("+ AbcControl.ClientID +");" %>' />

Related

Server tag not evaluated in server control

On my ASPX page, I need a server control checkbox to pass a backend variable as a parameter in its onclick JS function. But it doesn't seem to work as expected.
Please refer the two checkboxes below:
<input type="checkbox" id="Checkbox1" onclick="ToggleMyOnly('<%=gsListID %>');" />
<input type="checkbox" id="Checkbox2" runat="server" onclick="ToggleMyOnly('<%=gsListID %>');" />
Here the Checkbox1 evaluates the value of gsListID as expected. However, Checkbox2 just passes it as is.
The only difference between these two controls is that Checkbox2 is a server control.
I have searched for a solution for this issue across many sites, but did not get an answer.
I also tried converting the Checkbox1 to an ASP checkbox as follows:
<asp:CheckBox ID="CheckboxASP" runat="server" Text="test" onclick="ToggleMyOnly('<%=gsListID %>');" />
But this also did not evaluate the server tag.
Can anyone help me know how to use the server tag in "onclick" for a server control input element? (Avoiding an ASP:checkbox preferred).
You should write like below:
<asp:CheckBox runat="server" ID="chk" Text="Test" onchange="return ToggleMyOnly('<%=gsListID %>');" />
if you dont want to postback then return false from ToggleMyOnly function.
It's working from myside.

How to pass a value from asp.net datalist to javascript textbox?

I already have a dataList:
<asp:DataList ID="dlIndex" runat="server" Width="61%" Height="83px">
<ItemTemplate>
<td style="text-align: center; padding-right: 0px; width: 50px;">
<asp:Label ID="Adress" runat="server" Text='<%# Eval("artikli_na_skladistu.skladista.Adresa")%>'></asp:Label>
</td>
</ItemTemplate>
</asp:DataList>
Now, I want to pass the value of the Label to a javascript textbox let's say ...
<input type="text" id="fname" value="">
document.getElementById("fname").value = getVal();
function getVal() {
???
}
So when I run the web site, I wanna see the value of the datalist Label inside the textbox javascript ...
How do I do that ?
Thank you,
You haven't thought out your solution well enough. If you only have one item, why are you using a DataList? You should directly bind in the markup using <%=MyObject.artikli_na_skladistu.skladista.Adresa%>. If you have more than one item in your DataList, how are you going to figure out which one to show?
I found a solution ... it's very, very ugly, but it works (for me)::
So, in the datalist ... the Label(s) was an asp.net Label(s) ... I change it javascript Label, like so:
<asp:DataList ID="dlIndex" runat="server" Width="61%" Height="83px">
<ItemTemplate>
<label id="Adresa"><%# Eval("artikli_na_skladistu.skladista.Adresa") %></label>
</ItemTemplate>
</asp:DataList>
and then, I just had to call it in javascript:
<script type = "text/javascript">
var url = "/Something.aspx?val=" + document.getElementById("Adresa").textContent;
</script>
I really am a newbie in javascript ... so this really works for me ...
Thanks to everyone who replied :D

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.

Page_ClientValidate('') can i do this at a control level

Does anyone know the way i can do similar to Page_ClientValidate in a way that not all of the controls on the page will be validated against? i.e. how i can just validate a particular custom validator is valid?
You can specify a ValidationGroup to group your controls. Then specify that string to the Page_ClientValidate function like so
<asp:TextBox id="text" runat="server" ValidationGroup="vld1" />
<asp:CheckBox id="check" runat="server" ValidationGroup="vld2" />
Page_ClientValidate('vld1');

Categories