title: Access jquery variable from the code behind
body: <p>This is my html:</p>
  
  <pre><code>&lt;input type="hidden" id="HiddenIndex" name="HiddenIndex" runat="server" /&gt;
  </code></pre>
  
  <p>Some labels and textbox</p>
  
  <pre><code> &lt;asp:Button runat="server" ID="btnGetCoordinates" 
      Text="Get Coordinates" OnClick="btnGetCoordinates_Click" /&gt; 
     &lt;asp:Label ID="info" runat="server" Text="Waiting...." /&gt;
  </code></pre>
  
  <p>So when the button Get Coordinates is clicked, it will call the Web Services to return some json results from code behind.  A Dialog will popup a listbox with these results.  It works perfectly until this point.  My goal is when a client select an item in the list and click on "Select" button, it will return the selected item's Index, store in a hidden field and manipulate later from the code behind.
  This is my jquery function
          </p>
  
  <pre><code>function ShowPopup()
  {
      $("#parentForm").fadeTo(500, .2);       
  
      $("#C1Dialog1").dialog({            
  
           open: function () {
               $(".ui-dialog-titlebar-close").hide();                 
           },
           buttons: [{
               text: "Select",
               click: function () {
                   var value = " ";
                   storedIndex = " ";
                   var selected = $("[id*=lstCandidates] option:selected");
                   selected.each(function () {
                       value = $(this).val();
                       storedIndex = $(this).index();
                       $("#HiddenIndex").val(storedIndex);                        
                   });
                   alert(value + " and index is " + storedIndex);  //Show value and index
                   alert("html hidden value " + $("#HiddenIndex").val());  //show value                 
  
                   $(this).dialog("close");
                   $("#parentForm").fadeTo(500, 1);                    
               },
               style: "margin-right: 40px;"
           },
           {
               text: "Cancel",
               click: function () {
                   $(this).dialog("close");
                   $("#parentForm").fadeTo(500, 1);
               },
               style: "margin-left:0px;"
           }]
      });
  }   
  &lt;/script&gt;
  </code></pre>
  
  <p>As you can see the alert show the value of the hidden field
  This is my code behind</p>
  
  <pre><code>   protected void btnGetCoordinates_Click(object sender, EventArgs e)
     {
          //Show the Dialog
          if (count &gt; 0)
          {
              ClientScript.RegisterStartupScript(this.GetType(), "Popup", "ShowPopup();", true);  
  </code></pre>
  
  <p>/<strong>/never stop here -</strong>-PROBLEM RIGHT HERE**, there is NO value for Hidden field** </p>
  
  <pre><code>        var indexValue = Request.Form["HiddenIndex"];
            info.Text = "HiddenIndex is " + indexValue;         
          }
      } 
  </code></pre>
  
  <p>The Info label show nothing when I click on Dialog's select button
  Any help would be appreciated , thank you very much.   </p>