Get Value Of Control In Code-Behind - c#

When I call <%= this.HiddenField.Value %> the value of HiddenField control in this case remains the same state (5) ? But when I call it with console.log(document.getElementById('<%= this.HiddenField.ClientID %>').value); this return the changed state in this case "active", why? How I can get the changed value in code behind (I want <%= this.HiddenField.Value %> to return "active"(the changed value)) ?
code:
<script>
$(function () {
document.getElementById('<%= this.HiddenField.ClientID %>').value = "active";
console.log(document.getElementById('<%= this.HiddenField.ClientID %>').value); // this return te changed value "active"
console.log('<%= this.HiddenField.Value %>') //this again is 5 not "active"
});
</script>
<asp:HiddenField ID="HiddenField" runat="server" Value="5" />

You are confusing server side and client side code and when they run.
Server side code runs first. This is what's in the <%=%> blocks. In it, when using this.HiddenField.Value, it will output the server side value of the control, before it has been changed client side. this.HiddenField.ClientID will output the control ID as output by the server so you can get it from client side code.
When the page first loads, the <%=%> sections will be replaced with the server side values.
This would look like (in the browser once the page loads do - view source to see what was actually rendered to the browser):
<script>
$(function () {
document.getElementById('someId').value = "active";
console.log(document.getElementById('someId').value); // this return te changed value "active"
console.log('5') //this again is 5 not "active"
});
</script>
<input type="HiddenField" ID="someId" Value="5" />
Then, and only then, will client side code run, with the results you have seen.

In the following line
console.log('<%= this.HiddenField.Value %>')
<%= this.HiddenField.Value %> is evaluated at server so in the browser its
console.log('5')
because that's the value of the expression.

<%= whatever %> evaluates whatever when the page is rendered on the server.
If you look at the HTML sent to your client, you will find something like
$(function () {
document.getElementById('blahblah_HiddenField').value = "active";
console.log(document.getElementById('blahblah_HiddenField').value);
console.log('5')
});
The 5 is rendered by the server - there's nothing on the client's end linking that 5 to the value in the hidden field, so it doesn't get updated when the hidden field's value changes.

It happens because the asp.net control shows the "server" value, that is 5. With javascript you are modifing the dom on the client side, the asp.net control value doesn't change until you post the page.

Or you can use ClientIDMode
<asp:HiddenField ID="HiddenField1" runat="server" ClientIDMode="Static" />
Set and Get;
in jquery
$('#HiddenField1').val('active');
console.log($('#HiddenField1').val());
in javascript
document.getElementById('HiddenField1').value = 'active';
console.log(document.getElementById('HiddenField1').value);

Related

How to get value if a input fields defined as ClientIDMode="Static"

I defined input control on webform as
<input type="text" id="Amount1" class="auto-sum" ClientIDMode="Static" runat="server">
and on runtime it appears as below.
<input name="ctl00$ContentPlaceHolder1$Amount1" id="Amount1" class="auto-sum" type="text">
When i try to get the value from CodeBehind i can see the control name
i get nothing as Amount. how to get value of such input field
You can try this
TextBox1.Text = Amount1.Value
I would recommend against using ClientIDMode="Static". This can cause problems later on. Especially since you seem to be using ContentPlaceHolder, which would indicate a Master Page.
Consider the following. You add TextBox1 with a static ID on the Master Page, some time later you do the same on a Page which uses a Master Page. You now have two elements on the page with ID TextBox1, instead of ctl00$TextBox1 and ctl00$ContentPlaceHolder1$TextBox1.
If you need it for Client side purposes, you can always use TextBox1.ClientID
<asp:TextBox ID="Amount1" runat="server" CssClass="auto-sum"></asp:TextBox>
<script type="text/javascript">
document.getElementById("<%= Amount1.ClientID %>").value = "It works!";
</script>

Can i pass value received by the java-script in .aspx page to its corresponding .cs file in asp.net?

I have a abc.aspx file that is receiving some value using java-script.
i.e.
<asp:Content ID="Content1" ContentPlaceHolderID="ccont" Runat="Server">
<div id="ccont">
<script type="text/javascript">
function show(id) {
alert('id');
}
</script>
<div class="ccont">
</div>
As seen in the code above i can get certain int value say 1,2,3 and so on.But the value is inside the script tag.so my question is:
How do i get that value inside the body of the abc.aspx file say inside the div tag? ie anywhere outside the script.
How do i pass the value obtained in this abc.aspx file to its abc.axps.cs file
Try using ASP.Net's HiddenField control:
<asp:HiddenField ClientIDMode="static" ID="hiddenId" runat="server"/>
This will render an invisible input on your page will which hold your value.
Using jQuery, you can assign a value to it like this:
$(function(){
var value = $('.ccont').text(); //Get your value somehow
$('#hiddenId').val(value);
});
Once your page is submitted to the server, you will see that the hiddenId control will be populated in the page's OnLoad handler.

How to get value in C# from java script?

I need to get a value that I got in Javascript to my code behind file..
My design code is:
<asp:DropDownList ID="ddlStatusOverview" runat="server" Width="95px" onchange="CheckSelectedItem(this)" >
</asp:DropDownList>
I'm using the dropwonlist in "ItemTemplate" of asp:ListView.
My javascript coding is:
<script type="text/javascript">
function CheckSelectedItem(ddl) {
alert(ddl.value);
}
I want to get that "dll.value" value in code behind.. I already used Webmethod concept. But my problem is I need to get the value in ".ascx" page.. How to do that..?
I don't know how to use hidden field value concept too..
Do this :
Add a hidden field element :
<input name='lala' id='lala' type='hidden'/>
Add this :
function CheckSelectedItem(ddl) {
document.getElementByID('lala').value=ddl.value;
}
On server side :
you can get the value by :
Request.Form["lala"].ToString();
Accoring to your comment :
If I want to call a server side function from javascript with this
"ddl.value" means, how to do that?
Please read this
ASP.NET pass a javascript value in server side
Introduce a hidden field.
<script type="text/javascript">
function CheckSelectedItem(ddl) {
document.getElementByID('hfStatus').value = ddl.value;
// if using jQuery
// $("hfStatus").val(ddl.value);
}
</script>
<asp:HiddenField runat="server" ID="hfStatus" />
Now you can directly access hfStatus from code-behind.

Pass Javascript Variable To C# Code Behind

How to get value from javascript to C# code behind ? I have an idea with the code below. In javascript code I want to assign the value of "HiddenField" Control with string value and then I want to take this value from "HiddenField" in code behind. But with this code I cannot do it. Can you tell me how to make it ?
<script>
$(function () {
document.getElementById('HiddenField').value = "active";
console.log(<%= this.HiddenField.Value %>)
});
</script>
<asp:HiddenField ID="HiddenField" runat="server" Value="5" Visible="true" />
you need to use ClientID property of control to get actual element ID in DOM.
<script>
$(function () {
document.getElementById('<%= HiddenField.ClientID%>').value = "active";
console.log(document.getElementById('<%= HiddenField.ClientID%>').value)
});
</script>
<asp:HiddenField ID="HiddenField" runat="server" Value="5" Visible="true" />
Use the Control ID for HTML markup that is generated by ASP.NET.
document.getElementById('<%= HiddenField.ClientID%>').value = "active";
When a Web server control is rendered as an HTML element, the id
attribute of the HTML element is set to the value of the ClientID
property. The ClientID value is often used to access the HTML element
in client script by using the document.getElementById method.
Then send the Hidden value through the javascript function as a variable while calling the controller
Surely works,
Cheers
Phani*
you may take a look at mshtml
As far as I know you call with this C# functions from your javascript code ;-)

Div onload function and embedding server code c#

I am trying to call c# properties in .aspx page, where myfunc is jquery function.
this function take parameters which i am passing through c# public properties. and I want to call this function as soon as div is rendered.previously i have done this on prerender event in ascx control. wha is exact ssyntax for below code and calling jquery function from here is valid?
<div class ="v" onload ="Javascript:myfunc('<%= this.articleID %> '
,'" +<%=this.UserID %>+"','" +<%=this.EncryptedUserID %>" +','" +<%#
this.ItemIndex %>)">
thanks
Edited
Ok If i do like this way
<div class ="v" >
<script language ="javascript" >
JGetTotalVotes(<%= this.articleid %> ,<%
this.ThisEncryptedUserID %>,<% this.ItemIndex %>,'aaa');
</script>
I do not want server side hidden fields solutions and if i use hiden field ( non server html tag) then i still need to call <%%> to fetch value from server side to hiddent field
I see you are missing single quote after the last parameter if that is not the problem.
You can use hidden fields and call the function in javascript
Add this to your page
<asp:HiddenField runat="server" ID="hdnArticleId" ClientIDMode="Static" />
<asp:HiddenField runat="server" ID="hdnUserId" ClientIDMode="Static"/>
<asp:HiddenField runat="server" ID="hdnEncryptedUserID" ClientIDMode="Static"/>
<asp:HiddenField runat="server" ID="hdnItemIndex" ClientIDMode="Static"/>
bind those hiddenfields in Page_Load event remember to add ClientIDMode="Static" to set the id as you set not a generated one by asp.net to have the ability to use them in javascript
Add To your javascritp
function YourFunction(){
var ArticleId = document.getElementById("hdnArticleId").value;
var UserId= document.getElementById("hdnUserId").value;
var EncryptedUserID= document.getElementById("hdnEncryptedUserID").value;
var ItemIndex= document.getElementById("hdnItemIndex").value;
// your code goes here
}
and don't forget to call your javascript function in page onload
Div elements don't pull in external content, so they don't have load events.
If you want to run some JS after a div element has been parsed:
<div></div>
<script> foo(); </script>

Categories

Resources