title: Serialize method of ajax not returning required values
body: <p>I am trying to get form inputs through ajax j query bootstrap modal and store it into the database but serialize method is not returning all the values required.</p>
  
  <p>It should have returned the values of user_id and btn_action...
  where did  I go wrong..??</p>
  
  <p>I have tried many solutions but could not get any answer...</p>
  
  <p>below are html  and javascript code. I am using all the required jquery resources. </p>
  
  <pre><code>&lt;form method="post" id="user_form"&gt;
    &lt;div class="modal-content"&gt;
    &lt;div class="modal-header"&gt;
    &lt;h4 class="modal-title"&gt;&lt;/i&gt; Add User
    &lt;/h4&gt;
    &lt;button type="button" class="close" data-dismiss="modal"&gt;&amp;times;
   &lt;/button&gt;
  
    &lt;/div&gt;
    &lt;div class="modal-body"&gt;
    &lt;div class="form-group"&gt;
  &lt;label&gt;Enter User Name&lt;/label&gt;
  &lt;input type="text" name="user_name" id="user_name" class="form-control" required /&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
  &lt;label&gt;Enter User Email
  &lt;/label&gt;
  &lt;input type="email" name="user_email" id="user_email" class="form-control" required /&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
  &lt;label&gt;Enter User Password&lt;/label&gt;
  &lt;input type="password" name="user_password" id="user_password" class="form-control" required /&gt;
  &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="modal-footer"&gt;
    &lt;input type="hidden" name="user_id" id="user_id" /&gt;
    &lt;input type="hidden" name="btn_action" id="btn_action" /&gt;
    &lt;input type="submit" name ="action" id= "action" class="btn btn-primary" 
     value="Add" /&gt;
    &lt;button type="button" class="btn btn-default" data-dismiss="mo  
    dal"&gt;Close&lt;/button&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/form&gt;
  
  //script code:
  
  $(document).on('submit', '#user_form', function(event){
  event.preventDefault();
  $('#action').attr('disabled','disabled');
  var form_data = $('#user_form').serialize();
  alert(form_data);
  // console.log(form_data)
  $.ajax({
  url:"user_action.php",
  method:"POST",
  data:form_data,
  success:function(data)
  
  {
  $('#user_form')[0].reset();
  $('#userModal').modal('hide');
  $('#alert_action').fadeIn().html('&lt;div class="alert alert-success"&gt;'+data+'&lt;/div&gt;');
  $('#action').attr('disabled', false);## Heading ##
  
  }
  });
  });
  </code></pre>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;script&gt;
  
      $(document).on('click','#add_button',function(){
      $('#action').val("Insert");
  
      $('.modal-title').text("Add User");
  
      });
  
      $(document).on('submit', '#user_form', function(event){
      event.preventDefault();
  
  
      var form_data = $('#user_form').serialize();
      alert(form_data);//not returning the required values
  
      $.ajax({
      url:"user_action.php",
      method:"POST",
      data:form_data,
      contentType:false,
      processData:false,
      success:function(data)
  
      {
      $('#user_form')[0].reset();
      $('#userModal').modal('hide');
      $('#alert_action').fadeIn().html('&lt;div class="alert alert-success"&gt;'+data+'&lt;/div&gt;');
      $('#action').attr('disabled', false);
      userdataTable.ajax.reload();
      }
      });
      });
  
  
  
  
  
      });
  
  
      &lt;/script&gt;</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!-- form --&gt;
  &lt;form method="post" id="user_form"&gt;
    &lt;div class="modal-content"&gt;
    &lt;div class="modal-header"&gt;
    &lt;h4 class="modal-title"&gt;&lt;/i&gt; Add User&lt;/h4&gt;
    &lt;button type="button" class="close" data-dismiss="modal"&gt;&amp;times;&lt;/button&gt;
  
    &lt;/div&gt;
    &lt;div class="modal-body"&gt;
    &lt;div class="form-group"&gt;
  &lt;label&gt;Enter User Name&lt;/label&gt;
  &lt;input type="text" name="user_name" id="user_name" class="form-control" required /&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
  &lt;label&gt;Enter User Email&lt;/label&gt;
  &lt;input type="email" name="user_email" id="user_email" class="form-control" required /&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
  &lt;label&gt;Enter User Password&lt;/label&gt;
  &lt;input type="password" name="user_password" id="user_password" class="form-control" required /&gt;
  &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="modal-footer"&gt;
    &lt;input type="hidden" name="user_id" id="user_id" /&gt;
    &lt;input type="hidden" name="btn_action" id="btn_action" /&gt;
    &lt;input type="submit" name ="action" id= "action" class="btn btn-primary" value="Add" /&gt;
    &lt;button type="button" class="btn btn-default" data-dismiss="mo  dal"&gt;Close&lt;/button&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/form&gt;
  
  &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>