2016-07-28 2 views
3

初めてselect2を使用しようとしています。select2にデータを渡す方法> 4.0

静的配列からデータを取得したいと考えています。手伝ってくれませんか?ここで

は私のコードです:

$(document).ready(function() { 

    var names = [{"id":"1","name":"Adair,James"} 
      , {"id":"2","name":"Anderson,Peter"} 
      , {"id":"3","name":"Armstrong,Ryan"}]; 

    $("#e10_2").select2({ 
     processResults: function(){ 
      return { 
      results: $.map(names, function(obj) { 
       return { id: obj.id, text: obj.name }; 
      }) 
      }; 
     } 
    }); 

}); 

答えて

2

あなたがようselect2に配列を渡すためにdataオプションを使用することができます:あなたはtext属性があなたの配列を適応していない場合

$("#e10_2").select2({ data: names }); 

この目的のために作成されたドキュメントの一部を確認してください。The id and text properties are strictly enforcedたとえば、

$(function() { 
    var names = [{"id":"1","name":"Adair James"} 
       , {"id":"2","name":"Anderson Peter"} 
       , {"id":"3","name":"Armstrong Ryan"}]; 

    var data = $.map(names, function (obj) { 
     obj.id = obj.id; 
     obj.text = obj.name; 

     return obj; 
    }); 

    $("select").select2({width: '100%',data: data}); 
}); 

希望します。

$(function() { 
 
    var names = [{"id":"1","name":"Adair James"} 
 
       , {"id":"2","name":"Anderson Peter"} 
 
       , {"id":"3","name":"Armstrong Ryan"}]; 
 

 
    var data = $.map(names, function (obj) { 
 
    obj.id = obj.id; 
 
    obj.text = obj.name; 
 

 
    return obj; 
 
    }); 
 

 
    $("select").select2({width: '100%',data: data}); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://select2.github.io/dist/js/select2.full.js"></script> 
 
<link href="https://select2.github.io/dist/css/select2.min.css" rel="stylesheet"/> 
 
<select></select>

+0

私は私のデータのテキストプロパティを持っていないので、それは – Vishal

+0

[OK]を@Vishalは、私は..あなただけの、あなたの配列を適応させる私の更新をチェックする必要があります参照して任意のデータは表示されません。 –

関連する問題