title: Send a hidden ID input field with AJAX
body: <p>With this AJAX script, I'm trying to send the content of contentText and contentID.</p>
  
  <p>Just sending contentTEXT works, but I want to send the ID as well, so I can comment on the original post.</p>
  
  <p>But it doesn't work!</p>
  
  <p>myData looks like this when it semi works:</p>
  
  <pre><code>&gt; var myData = '?content_txt='+$("#contentText").val(),
  &gt; '&amp;content_id='+$("#contentId").val(); //build a post data structure
  </code></pre>
  
  <p>But i want it to be something like this, i think </p>
  
  <pre><code>&lt;script type="text/javascript"&gt; $(document).ready(function() {
  
      //##### send add record Ajax request to response.php #########  $("#FormSubmit").click(function (e) {           e.preventDefault();             if($("#contentText").val()==='')            {
                  alert("Please enter some text!");
                  return false;           }
                          $("#FormSubmit").hide(); //hide submit button           $("#LoadingImage").show(); //show loading image
  
              var myData = '?content_txt='+$("#contentText").val(), '&amp;content_id='+$("#contentId").val(); //build a post data structure
              jQuery.ajax({           type: "POST", // HTTP method POST or GET            url: "response.php", //Where to make Ajax calls             contentType: "application/x-www-form-urlencoded;charset=UTF-8",             dataType:"text", // Data type, HTML, json etc.          data:myData, //Form variables           success:function(response){
                  $("#responds").append(response);
                  $("#contentText").val(''); //empty text field on successful
                  $("#FormSubmit").show(); //show submit button
                  $("#LoadingImage").hide(); //hide loading image
  
              },          error:function (xhr, ajaxOptions, thrownError){
                  $("#FormSubmit").show(); //show submit button
                  $("#LoadingImage").hide(); //hide loading image
                  alert(thrownError);             }           });     });
  
      //##### Send delete Ajax request to response.php #########  $("body").on("click", "#responds .del_button", function(e) {         e.preventDefault();         var clickedID = this.id.split('-'); //Split ID string (Split works as PHP explode)          var DbNumberID = clickedID[1]; //and get number from array          var myData = 'recordToDelete='+ DbNumberID; //build a post data structure
                  $('#item_'+DbNumberID).addClass( "sel" ); //change background of this element by adding class       $(this).hide(); //hide currently clicked delete button
                      jQuery.ajax({           type: "POST", // HTTP method POST or GET            url: "response.php", //Where to make Ajax calls             dataType:"text", // Data type, HTML, json etc.          data:myData, //Form variables           success:function(response){
                  //on success, hide  element user wants to delete.
                  $('#item_'+DbNumberID).fadeOut();           },          error:function (xhr, ajaxOptions, thrownError){
                  //On error, we alert user
                  alert(thrownError);             }           });     });
  
  }); &lt;/script&gt;
  </code></pre>
  
  <p>My form I'm trying to use</p>
  
  <pre><code>&lt;form class="form-horizontal" accept-charset="utf-8"&gt;
  &lt;fieldset&gt;
  &lt;legend&gt;&lt;?php echo WORDING_ADD_A_COMMENT; ?&gt;&lt;/legend&gt;
  &lt;!-- Textarea --&gt;
  &lt;div class="control-group"&gt;
    &lt;div class="controls"&gt;                     
      &lt;textarea name="content_txt" id="contentText" cols="45" rows="5" placeholder="&lt;?php echo WORDING_COMMENT_PLACEHOLDER; ?&gt;"&gt;&lt;/textarea&gt;
      &lt;input type="hidden" name="content_id" id="contentId" value="&lt;?php echo $_GET['topic_id']; ?&gt;"/&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;!-- Button --&gt;
  &lt;div class="control-group"&gt;
    &lt;label class="control-label" for="singlebutton"&gt;&lt;/label&gt;
    &lt;div class="controls"&gt;
      &lt;button id="FormSubmit" class="btn btn-primary"&gt;&lt;?php echo WORDING_BUTTON_COMMENT_BOX; ?&gt;&lt;/button&gt;
      &lt;img src="images/loading.gif" id="LoadingImage" style="display:none" /&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/fieldset&gt;
  &lt;/form&gt;
  </code></pre>