title: Add the value of the hidden input field of other option
body: <p>I ended by this code after helping with many thanks of others here in this website. Now, in the following code of submitting the form, I want the value of the hidden input field to be instead of Other when shown the result.</p>
  
  <p></p>
  
  <pre><code>&lt;form action="" method="post"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-sm-8 col-sm-offs et-2"&gt; 
              &lt;select class="form-control" name="country" id="country" required &gt;
                  &lt;option value=""&gt;Please select your country&lt;/option&gt;
                  &lt;option value="A"&gt;Country A&lt;/option&gt;
                  &lt;option value="B"&gt;Country B&lt;/option&gt;
                  &lt;option value="C"&gt;Country C&lt;/option&gt;
                  &lt;option value="Other"&gt;Other&lt;/option&gt;
              &lt;/select&gt;
  
               &lt;input type ="text" id="country_other" style="display:none"&gt;
  
                  &lt;button type="submit" class="btn btn-gpsingh"&gt;Next&lt;/a&gt;
               &lt;/div&gt;
       &lt;/div&gt;
    &lt;/form&gt;
  
  &lt;script&gt;
  $("#country").change(function(){
  
      var value = this.value;
      if(value =='Other')
      {
          $("#country_other").show();
          $("#country_other").attr('required', false);
  
  
      }
       else
      {
         $("#country_other").hide();  
         $("#country_other").val('');
         $("#country_other").attr('required', false);
      }    
  });
  &lt;/script&gt;
  </code></pre>