Javascript do not return a proper value when used in a content page ASP.NET

Question

I'm totally new to Javascript(Jquery) and still a beginner in ASP.NET. I have a contentpage that has a gridview gvUsers I made a code for the event RowDatabound that add an "id" in its markup for every rows. and its rows are clickable and can be selected through javascript in the contentpage page.

  <script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
             <script type="text/javascript">
                 $(function() {

                $('#<%=gvUsers.ClientID%> tr[id]').click(function() {
                    $('#<%=gvUsers.ClientID%> tr[id]').css({ "background-color":  "White", "color": "Black" });
                    $(this).css({ "background-color": "Black", "color": "White" });          
                });

                $('#<%=gvUsers.ClientID%> tr[id]').mouseover(function() {
                    $(this).css({ cursor: "hand", cursor: "pointer" });
                });

            });

                 $(function() {

                var RowID = $('#hdnEmailID').val();
               if (RowID != "0") {
                    $('#<%=gvUsers.ClientID%> tr[id=' + RowID + ']').css({ "background- color": "Black", "color": "White" });
               }

                $('#<%=gvUsers.ClientID%> tr[id]').click(function() {
                    $('#<%=gvUsers.ClientID%> tr[id]').css({ "background-color": "White", "color": "Black" });
                    $(this).css({ "background-color": "Black", "color": "White" });
                    $('#hdnEmailID').val($(this).attr("id"));
                });

                $('#<%=gvUsers.ClientID%> tr[id]').mouseover(function() {
                    $(this).css({ cursor: "hand", cursor: "pointer" });
                });

                });

            </script>

In these scripts, they get the "id" property of the selected row and save it to hdnEmailID...

<INPUT id="hdnEmailID" type="hidden" value="0" runat="server" >

To make the value hdnEmailID displayed in the page I made a code in inside a button click event that has a code like this..

Response.write(hdnEmailID.value);

At first it works pretty fine and displays the "id" of the row that I clicked however after I used this code in a master-content pages the script returns 0. And it seems that when I click the button.. The masterpage is reloaded and seems the script is reloading too thus returning the default 0 I am not sure if this is really what happened since I'm a beginner in ASP.NET :)

score 2 · Accepted Answer · edited May 23 '17 at 12:21

Is because you do not use the rendered id, the error is on this code:

  var RowID = $('#hdnEmailID').val();

and

  $('#hdnEmailID').val($(this).attr("id"));

it sould be as

  var RowID = $('#<%=hdnEmailID.ClientID%>').val();

and

  $('#<%=hdnEmailID.ClientID%>').val($(this).attr("id"));

The id that is rendered by the controls is not the one you see on code behind, when you use it on a single page some time is the same, but when you add it to the master is change dynamically, now on your html rendered code you need to render that dynamic id.

In asp.net ver 4 there is a parameter on the controls that you can use it to make them static and not change the ClientIDMode ="Static"

Similar:
How do I access a DIV from javascript, if ASP.NET mangles its ID?
Accessing control client name and not ID in ASP.NET
Get clientid in user control from external javascript file
How to find and modify an asp.net control with JavaScript?

Thanks a lot! It really worked! I was debugging this since last night and cant trace my problem Thanks! — Emmanuel Gabion, Dec 12 '12 at 06:50

Javascript do not return a proper value when used in a content page ASP.NET

1 Answers1