Bootstrap Select2獲取遠端資料
阿新 • • 發佈:2018-12-04
1 Select2文件
2 資原始檔
<!-- styles --> <link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="../select2/select2.min.css"> <!-- jquery.js --> <script src="../jquery.min.js" type="text/javascript"></script> <!-- select2.full.min.js --> <script src="../select2/select2.full.min.js" type="text/javascript"></script> <!-- bootstrap.js --> <script src="../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
3 html部分
<div class="form-group" valdr-form-group> <label class="col-sm-3 control-label"> <apollorequiredfield></apollorequiredfield> 應用Id</label> <div class="col-sm-3"> <select class="form-control select2 " id="testselect" name="appId" ng-model="app.appId"> </select> <small>(應用唯一標識)</small> </div> </div>
4 js部分
function getappid() { $('.select2').select2(); $.ajax({ "url": "https://api.github.com/orgs/select2/repos", "type": "GET", "async": false, "data": { //token: login_user_session, //id: uid}, "success": function (result) { var obj = eval(result); var count = Object.keys(obj.Body).length; for (var i = 0; i < count; i++) { var appId = obj.Body[i].id; var appName = obj.Body[i].name; $("#testselect").append("<option value='" + appId + "'>" + appId + ' '+'/'+' '+appName + "</option>"); } } }); } getappid();
5 Select2取值
var selectedappid = $("#testselect").select2('data')[0];