To get value set in javascript in code behind

Question

I have following in html

<div id="dvAddToGrid" runat="server">
 <table style="margin-left:80%">
  <tr>
   <td>
     <asp:LinkButton ID="lnkAddToGrid" runat="server" Text="Add New" onclick="lnkAddToGrid_Click" OnClientClick="GetValues()" Font-Underline="True"></asp:LinkButton>
   </td>
  </tr>
 </table>
</div>

I have following in javascript

function GetValues() {

//    for (i = 1; i <= 5; i++) 
//    {
//        $("#hdnTableValues")[0].value += document.getElementById("txtSerialNo_1").value+ ",";
//        $("#hdnTableValues")[0].value += document.getElementById("txtBookName_1").value + ",";
//        $("#hdnTableValues")[0].value += document.getElementById("txtAuthor_1").value + ",";
//        $("#hdnTableValues")[0].value += document.getElementById("txtPublisher_1").value + ",";
//        $("#hdnTableValues")[0].value += document.getElementById("txtNoOfBooks_1").value + ",";
//        $("#hdnTableValues")[0].value += document.getElementById("txtRemarks_1").value + "|";
//           //    }
    document.getElementById("lblTableValues").innerHTML = $("#hdnTableValues")[0].value ;

}

In my code behind i have

 protected void lnkAddToGrid_Click(object sender, EventArgs e)
        {
            DataTable dtBookList = new DataTable();
            dtBookList.Columns.Add("SerialNo");
            dtBookList.Columns.Add("BookName");
            dtBookList.Columns.Add("Author");
            dtBookList.Columns.Add("Publisher");
            dtBookList.Columns.Add("NoOfBooks");
            dtBookList.Columns.Add("Remarks");
            string str = lblTableValues.Text ;
            for(int i=1;i<5;i++)
            {
                DataRow dtRow = dtBookList.NewRow();
                //hdnTableValues.Value 
            }
                       dvBookList.Visible = false;
            dvAddToGrid.Visible = false;

        }

Problem is i am getting values in lblTableValues in js.But in code behid it does not contain any values its value is "".Can anybody help to get the value contained in hdnTableValues in click event in code behind.

Answer 1

You can use a hidden input with runat="server" to handle this. Store the value to the hidden field in JavaScript. And you can access the field value in C# code behind.

HTML

<input type="hidden" id="txtHidData" runat="server" />

JavaScript

document.getElementById ( "txtHidData" ).value = "your value";

C#

string valueInCodeBehind = txtHidData.Value;

Answer 2

Use the asp:HiddenField control like this: (jquery example)

in the page or control:

    <asp:HiddenField ID="Hidden1" runat="server" Value="blank" />

    <asp:PlaceHolder runat="server">
    <script type ="text/javascript">
        $(function () {
            //get the id of the hidden control
            var clientID = "<%= Hidden1.ClientID %>";
            $("#" + clientID).val("this is from the client");
        });    
    </script>
</asp:PlaceHolder>

In a button or submit method in code behind:

 Debug.WriteLine("val: " + Hidden1.Value);