How do I get client-side value to server-side ASP.NET?

Question

0.00/5 (No votes)

See more:

I tried to pass a variable from the client side to server side using HiddenField like in this example: asp.net - pass client side javascript value to server side C# - Stack Overflow

What I have tried so far:

HTML

<!DOCTYPE html>

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script type ="text/javascript"> 
         <script type ="text/javascript"> 
                function passValue() {
                    document.getElementById('<%=HiddenField1.ClientID%>').value = "some stuff";
                }
                 window.onload = passValue;

            </script>
    </head>
    <body>    
        <form id="form1" runat="server">
        <div>    
            <asp:HiddenField ID="HiddenField1" runat="server"/>

            <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick ="passValue()"/>

        </div>
        </form>
    </body>
</html>

On the server side I have the following code:

C#

protected void Page_Load(object sender, EventArgs e)
        {
            string a, b;
            if (IsPostBack)
            {
                Response.Write("The input value is: " + HiddenField1.Value.ToString());
                a = HiddenField1.Value.ToString();
            }
            else
            {
                Response.Write("The input value is: " + HiddenField1.Value.ToString());
                b = HiddenField1.Value.ToString();
            }
        }

When my page opens I expect to see on it the message: "The input value is: some stuff". The message appears only if I press the button because only in this case the IsPostBack becomes true. What should I do so get the message without pressing the button? Thanks in advance!

What I have tried:

In the above section can be seen what I have tried so far.

Posted 19-May-16 21:51pm

DrgIonuţ

Updated 19-May-16 22:35pm

Add a Solution

Comments

CHill60 20-May-16 3:59am

When you first load your page HiddenField1 has no value (because you have not initialised it to anything). It is only getting a value in button1 OnClientClick.
Try <asp:HiddenField ID="HiddenField1" runat="server" value="initial value"/>

F-ES Sitecore 20-May-16 5:18am

You need to understand the asp.net page lifecycle and the order things happen. When you request the page your page_load and code-behind runs first, they generate html which is then sent to the client. You can't have js on the client influence what happens on the server as the server code runs first.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Karthik_Mahalingam · Accepted Answer · 2016-05-19T22:35:00

Solution 1

To get the message as you expected, then you will have to write the code like this

ASP.NET

<asp:HiddenField ID="HiddenField1" Value="some stuff" runat="server" />

Since you are assigning the value to the hidden field in Client Side, the value can be accessed only on the PostBack

if you are assigning the value to hidden field in the mark up then you can get the value on Page Load ( not postback )

change the value as below to see how it works

JavaScript

document.getElementById('<%=HiddenField1.ClientID%>').value = "some other more stuff";

Now while the page is loaded for first time you will see the output as "The input value is :some stuff"
after post back the output will be "The input value is "some other more stuff"

Posted 19-May-16 22:35pm

Karthik_Mahalingam

Comments

DrgIonuţ 23-May-16 4:11am

It works! My question is next: is there any way to place instead of Value="some stuff" let's say for example the width of a div? I store the div's width in a var called dv. How could I pass the dv's value? I tried Value= dv, but what I get is "dv", not the actual value of dv. Thanks in advance!

Karthik_Mahalingam 23-May-16 4:15am

in many ways you can do that..
one of the way, wich is similar to the above
create a hiddenfield for storing the div width value

var dv = '200px'
document.getElementById('<%=HiddenField1.divId %>').value = dv;

else you can make the div as server control by adding an attribute ( runat="server" ) and you can acces the properties/Attributes directly in the code behind..

DrgIonuţ 23-May-16 4:19am

What I tried is:
var dv= document.getElementById('<%= HiddenField1.ClientID %>');
and div is:
<div id="myDiv" style="width:100%; background-color:red">

For the second option is no longer needed HiddenField?

Karthik_Mahalingam 23-May-16 4:23am

for second option, hiddenfield not necessary.

and correction to your code..
var dv= document.getElementById('myDiv').style.width;
document.getElementById('<%= HiddenField1.ClientID %>').value = dv;

DrgIonuţ 23-May-16 4:31am

So. I have this:
var dv = document.getElementById('myDiv').style.width;
document.getElementById('<%= HiddenField1.ClientID %>').value = dv;
<asp:HiddenField ID="HiddenField1" runat="server" Value="???"/>
On ther server side I have:
string myHiddenValue1 = this.HiddenField1.Value;
Response.Write(myHiddenValue1);

What I'm doing wrong here?

Karthik_Mahalingam 23-May-16 4:33am

<asp:HiddenField ID="HiddenField1" runat="server" Value=""/>
dont do anything here.. keep it empty..
you want to pass the data to server rite?
then on the client side button click event (onCliectClick) assign the div width to the hidden field as above code..

DrgIonuţ 23-May-16 4:37am

Yes. I want to pass the value of dv without pressing the button.

Karthik_Mahalingam 23-May-16 4:39am

That is not possible.
What you can do is
Make the div as server control and set the width

DrgIonuţ 23-May-16 4:43am

So I set on the div:
<div id="myDiv" style="width:100%; background-color:red" runat="server">
And on server side how could I get the value of div's width?

Karthik_Mahalingam 23-May-16 4:51am

string divWidth = myDiv.Style["width"];