title: Dynamically Set Value in seletpiker using jquery and Ajax
body: <p>I am getting City List From Database and I Want to Show the Selected City Selected While Edit Operation. </p>
  
  <p>I am Using Ajax for Getting a value from Database.
  That's Work Nicely. I get the Response Data From My Controller.
  Now The Problem is I am not Able to set a value on selectpiker.
  I get City Name In Ajax Response.</p>
  
  <p>I have tried Some Example but did not work. </p>
  
  <p>Here is the Ajax Code.</p>
  
  <pre><code>    $.ajax({  
       type: "GET",
       url: urlForGetCityList,             
       dataType: 'Json',                
       success: function(response){ 
           console.log(response.cityName);
  
            // This is What i Tried For getting SeletBox Selected.
           var $select = $('#city');
           $select.val(response.city).trigger('change');
  
           // I have also Tried Some Selct2 Option for it. But it didn't work.
           $("#city").select2("val", response.city);
  
          // And at Last I have tried for like simple select box.
          $("#city").val(response.city);
  
      });
  </code></pre>
  
  <p>None of this work properly.
  Here is the HTML Code of Selectpiker.</p>
  
  <pre><code>&lt;div class="col-md-4"&gt;
  &lt;div class="form-group"&gt;
      &lt;label for="field-3" class="control-label"&gt;City *&lt;/label&gt; 
      &lt;select class="selectpicker" data-live-search="true" data-style="btn-white" name="city" id="city"
          title="Select City"&gt;
          &lt;option value="city1"&gt;City 1&lt;/option&gt;
          &lt;option value="city2"&gt;City 2&lt;/option&gt;
      &lt;/select&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>