title: jQuery Fetch/Display data to dropdown when an id or data is selected on edit
body: <p>I'm trying to fetch the data into my dropdown when I edit an id or data, right now the value that is being fetched is null or none of the options that I have in my dropdown. Kindly help on how can I fetch the data using jquery / javascript.</p>
  
  <p>So my final output should be, <strong>when I choose an ID, the value of the dropdown should be displayed</strong></p>
  
  <p>here is my html code below, I have the dropdown input</p>
  
  <pre><code>&lt;select id="position" name="position" class="form-control"&gt;
      &lt;option&gt;Select Role&lt;/option&gt;
      &lt;option value="Admin" data-id="1"&gt;Admin&lt;/option&gt;
      &lt;option value="Staff" data-id="2"&gt;Staff&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>here is my script code below,which I use to choose an id to edit or view</p>
  
  <pre><code>variable I declare
  var position = $('input[name=position]');
  </code></pre>
  
  <p>my ajax code </p>
  
  <pre><code> success: function(data){
    $('input[name=position]').val(data.position); // here is the value from the dropdown
   }
  </code></pre>