how to set basic value to select box of Bootstrap Smartadmin

Question

I am working with bootstrap which uses SmartAdmin theme.

It turns all html structure into <section><div> struct include <select><option>.

So I its output looks like below.

<section id="00000001" class="col col-md-6">

        <label class="label">SomeLabel 
            <sapn class="cp_id_text"></sapn>            
        </label>

        <label class="select">
            <div class="select2-container form-hidden-control" id="s2id_00000001" title="" style="width: 100%;"><a href="javascript:void(0)" class="select2-choice" tabindex="-1">   <span class="select2-chosen" id="select2-chosen-9">20th Century Fox Film Corporation(00000001)</span><abbr class="select2-search-choice-close"></abbr>   <span class="select2-arrow" role="presentation"><b role="presentation"></b></span></a><label for="s2id_autogen9" class="select2-offscreen"></label><input class="select2-focusser select2-offscreen" type="text" aria-haspopup="true" role="button" aria-labelledby="select2-chosen-9" id="s2id_autogen9"></div><input type="text" class="form-hidden-control select2-offscreen" id="00000001" name="cp_id" value="" data-init-text="" inputtype="select" title="" maxlength="50" tabindex="-1">
            <script>$("#00000001").select2(selects2Option('00000002','cp_id'));</script>
        </label>    
    <script>

        $("#00000001").attr("maxlength", "50");
    </script>
</section>

Since I can not find any <select> tags, I can not use selected attribute to set default value.

I can find it via jquery parent(), find() and so on, but that does not look efficiency. Is there any way I can handle in simple way like selected ?

SmartAdmin site says they use select2 api, but they did not mention how to set a value as default.

site : http://192.241.236.31/smartadmin/BUGTRACK/track_/documentation/index.html#!/introduction

Thanks.

Answer 1

If you see the select2 demo's you will find Programmatic access area where they have given how to set value on button click. The same can be used to set the default value after initialization as below:

<select class="js-example-programmatic">
  <option value="one">First</option>
  <option value="two">Second</option>
  <option value="three">Third</option>
</select>

Js

$(document).ready(function() {
     $(".js-example-programmatic").select2();
     var $example = $(".js-example-programmatic");
     $example.val("three").trigger("change");
});

DEMO HERE