title: how to pass < input > value to php using ajax load
body: <p>I am trying to pass a value of an input item to php when loading the php file using ajax_load. this is that I have so far but it's not working.</p>
  
  <p>html and jquery:</p>
  
  <pre><code>&lt;tr&gt;
      &lt;td&gt;&lt;/td&gt;
      &lt;td&gt;
          &lt;button class="grey"&gt;Test Settings&lt;/button&gt;&lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr&gt;
      &lt;td&gt;&lt;/td&gt;
      &lt;td&gt;&lt;div class="font-size-15 color-semi-black" id="result"&gt;&lt;/div&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;input type="hidden" name="control" value="1"/&gt;
  
  &lt;!--Test Settings--&gt;
  {literal}
      &lt;script&gt;
          $.ajaxSetup({
              cache: false
          });
          var ajax_load = "&lt;img src='images/loaders/small-loader.gif' alt='loading...' /&gt;";
          var value = $("input[name='control']").val();
          //  load() functions
          var loadUrl = "demo/test_settings.php?val=" + value;
          $("button").click(function() {
              $("#result").html(ajax_load).load(loadUrl);
          });
  
      &lt;/script&gt;
  {/literal}    
  </code></pre>
  
  <p>php:</p>
  
  <pre><code>if ($val == '1'){
  
  //process code here. 
  
  }
  </code></pre>
  
  <p>It's not passing the value of the input. any suggestions?</p>