How to pass a variable from JavaScript to ASP

Question

I'm not really sure what I'm doing wrong. I would like to pass a variable from a JS function to ASP, and then print it in the console at a button click.

JS function:

<script>
    function can() {
        var candy = "Chocolate";
        document.getElementById("Hidden1").value = candy;
    }
</script>

ASP.net:

<form id="form1" runat="server">

    <div>
        <input id="Hidden1" type="hidden" runat="server" />
        <asp:Button ID="Button1" runat="server" OnClientClick="can()"  Text="Button"
            onclick="Button1_Click" />
    </div>
</form>

<script runat="server">
    protected void Button1_Click(object sender, EventArgs e){

        Response.Write(Hidden1.Value);
    }

</script>

Hidden1 client id will not be Hidden1 as you have runat server on it - you either need to use `clientidmode = "static"` or make your js use `Hidden1.ClientID` if your js is in your asp page - https://stackoverflow.com/questions/497802/how-to-stop-asp-net-from-changing-ids-in-order-to-use-jquery — Pete, Mar 06 '20 at 13:56
on your input - the element you are using your js to update by using `getElementByID` — Pete, Mar 06 '20 at 14:27

Md Farid Uddin Kiron · Accepted Answer · 2020-03-06T14:51:37.570

1

You have placed your aspx.cs file in wrong place which should be in .cs file. You should try like below:

Aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebFormTest.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>

    <form id="form1" runat="server">  

     <div>
        <input id="Hidden1" type="hidden" runat="server" />
        <asp:Button ID="Button1" runat="server" OnClientClick="can()"  Text="Button"
            onclick="Button1_Click" />
    </div>
    </form>

     <script>
        function can() {
        var candy = "Chocolate";
        document.getElementById("Hidden1").value = candy;
    }
</script>

</body>
</html>

Aspx.cs:

 protected void Button1_Click(object sender, EventArgs e)
        {

            Response.Write(Hidden1.Value);
        }

Test Result:

How To Get It Worked:

As per your comment: You have WebForm1.aspx page If you expand it you would get WebForm1.aspx.cs file just paste your cs file there will be work as expected.

See the screenshot for more clarity:

I have tested and working as expected.

edited Mar 06 '20 at 14:51

answered Mar 06 '20 at 14:23

Md Farid Uddin Kiron

16,817
3
17
43

Like do I physically create a new CS file? In doing this, I get the errors: "The name 'Respose' does not exist in the current context" and "The name 'Hidden1' does not exist in the current context" – Forrest Mar 06 '20 at 14:33
You have `WebForm1.aspx` page right? If you expand it you would get `WebForm1.aspx.cs` file just past your `cs` file there will be work as expected. – Md Farid Uddin Kiron Mar 06 '20 at 14:41
No worries , glad to help. – Md Farid Uddin Kiron Mar 06 '20 at 14:48
When I press the button, it refreshes the page as well, is there anyway to disable this? – Forrest Mar 06 '20 at 14:58
Yes it was a big draw back of aspx, you could use `autopostback="false"` on button . Also can use `Ajax` – Md Farid Uddin Kiron Mar 06 '20 at 15:03

How to pass a variable from JavaScript to ASP

1 Answers1