title: Multiple dropdown inputs on same page function
body: <p>I am trying to pass a url with some parameters on a dropdown select input, I am calling a function with the <code>onchange</code> event.</p>
  <p>The problem I having is that there are multiple dropdowns in the same page all utilizing a dropdown each. When I choose an option only the first select's value is being passed even if any select is chosen.</p>
  <p>e.g.</p>
  <pre><code>&lt;tr&gt;&lt;td&gt;
  &lt;select onchange=&quot;updateStatus();&quot;&gt;
      &lt;option value=&quot;changed&amp;amp;id=771&quot;&gt;Change&lt;/option&gt;
      &lt;option value=&quot;posted&amp;amp;id=771&quot;&gt;Posted&lt;/option&gt;
  &lt;/select&gt;
  &lt;/td&gt;&lt;/tr&gt;
  
  &lt;tr&gt;&lt;td&gt;
  &lt;select onchange=&quot;updateStatus();&quot;&gt;
      &lt;option value=&quot;changed&amp;amp;id=750&quot;&gt;Change&lt;/option&gt;
      &lt;option value=&quot;posted&amp;amp;id=750&quot;&gt;Posted&lt;/option&gt;
  &lt;/select&gt;
  &lt;/td&gt;&lt;/tr&gt;
  </code></pre>
  <p>And the Jquery function:</p>
  <pre><code>function updateStatus() {
  $.ajax({
      type: 'GET', 
      url: 'print.php',
      data: {stat: $('select').val()},
      success: function (data) {
          alert('done');
      }
  })
  }
  </code></pre>
  <p>I can see in my console that the data is being passed but always the first one's value.</p>
  <p><a href="https://i.stack.imgur.com/m1ZQ8.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/m1ZQ8.jpg" alt="enter image description here" /></a></p>
  <p>What do I need to change so that it is the corresponding value and not always the first one? thanks in advance.</p>