CODEWITHSUNDEEP
c#javascriptasp.netgetelementbyid
user1028998
user1028998

Reputation: 11

getElementById().value in JS, C#, and ASP.NET

I tried to get C# and JS to communicate each other through a hidden input. I looked a various forums and codes, but none of them seems to have this exact problem. Many of them had syntax error, and I have tried to debug that. It's mainly the line 

document.getElementById("Hidden1").value = str;

that doesn't seem to be working. I have tried putting alert messages before and after that line. Putting the alert before causes the alert to pop up, but putting it after doesn't cause it to pop-up which makes me suspect this line of code even more. No error messages were displayed when I ran it in Visual Studio 2010 through Chrome browser. If anyone can help with it at all, it'd be greatly appreciated.

If I remove the updatepanels, it still wouldn't work. It was actually what I tried at first, but I thought it might've been when the site refreshed during the button click, so I tried implementing the AJAX updatepanel property.

ASP.NET CODE

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master"     AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication10._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

</asp:Content>

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
  <asp:ScriptManager ID="ScriptManager1" runat="server"/>
  <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<Triggers>

 <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
             </Triggers>
             <ContentTemplate>
    <div>
        <input id="Hidden1" type="hidden" name="Hidden1" runat="server"    value="replaceme"     />
        <asp:Button ID="Button1" runat="server" OnClientClick="abc()"  Text="Button" 
            onclick="Button1_Click" />
    </div>
    <div>
    </ContentTemplate>
     </asp:UpdatePanel>
    <script type="text/javascript">
        function abc() {
            var str = "value";
            document.getElementById("Hidden1").value = str;  
        }
</script>
</div>

</asp:Content>

C# CODE

protected void Button1_Click(object sender, EventArgs e)
    {

        MessageBox.Show(Hidden1.Value);
    }

Upvotes: 1

Views: 11770

Answers (2)

LukeH
LukeH

Reputation: 269428

The client-side element won't have the id "Hidden1", it'll have an id that's auto-generated by ASP.NET.

That's why you're getting the problem on the client-side: document.getElementById('Hidden1') will return null, and you're then trying to access the value property of that null reference.

You need to use the auto-generated id in your JavaScript instead, via the ClientID property:

document.getElementById('<%=Hidden1.ClientID%>').value = str;

Upvotes: 0

Sam
Sam

Reputation: 10113

Your problem is probably because the asp.net control id and the client-side id for Hidden1 are not the same. View the HTML source to be sure, but I think you'll need something like: 

document.getElementById("<%= Hidden1.ClientID %>").value = "Some value";

Upvotes: 1

Related Questions