title: How do I sort table from dropdown list
body: <p>How do I create a simple sorting function for this. I know there is plugin like tablesorter. But it doesn't sort it from a dropdown list. Or is the plugin can be modified so that it can sort from a dropdown list. Thank you in advance.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form action="#" method="post"&gt;
    &lt;input type="text" id="UserID" name="UserID" readonly="readonly"&gt;
    &lt;input type="text" id="UserName" name="UserName" placeholder="Name"&gt;
    &lt;input type="text" id="UserOccupation" name="UserOccupation" placeholder="Occupation"&gt;
    &lt;button type="button" name="button"&gt;Add&lt;/button&gt;&lt;br&gt;
  &lt;/form&gt;
  Sort By:
  &lt;select&gt;
    &lt;option&gt;ID&lt;/option&gt;
    &lt;option&gt;Name&lt;/option&gt;
    &lt;option&gt;Occupation&lt;/option&gt;
  &lt;/select&gt;
  &lt;table id="table" class="tablesorter"&gt;
    &lt;thead&gt;
      &lt;tr &gt;
        &lt;th&gt;ID&lt;/th&gt;
        &lt;th&gt;Name&lt;/th&gt;
        &lt;th&gt;Occupation&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p></p>
  
  <p>Javascript:</p>
  
  <pre><code>$(document).ready(function() {
    //Set id field to 1
    var id = $('#UserID');
    id.val("1");
  
    //Add 1 to the id in textbox
    function incID(){
      var str = id.val();
      var int = parseInt(str);
      var idVal = int + 1;
      id.val(idVal.toString());
    }
    //When button clicked
    $('button').on('click', function(){
      //create a new object
      var obj = new Object();
      //pass value dynamically from input box
      obj.id = $('#UserID').val();
      obj.name = $('#UserName').val();
      obj.occupation = $("#UserOccupation").val();
      //display data to the table
      var addrow = "&lt;tr&gt;&lt;td&gt;" + obj.id + "&lt;/td&gt;&lt;td&gt;" + obj.name + "&lt;/td&gt;&lt;td&gt;"+ obj.occupation +"&lt;/td&gt;&lt;/tr&gt;";
      $("table tbody").append(addrow);
      //Add 1 to id field
      incID();
    });
  
  });
  </code></pre>