36

Ajaxでselect2コントロールをセットアップしました（単一と複数の両方があります）。ページの読み込みにいくつかの値を設定しようとしていますが、これを機能させることができません。select2 の私のコードを以下に示します。

function AjaxCombo(element, url, multival ){  // multival = true or false
  multival = multival || false;
  $(element).select2({
   minimumInputLength: 2,
   multiple: multival,
   separator: '|',
   ajax: {
     url: url,
     dataType: 'json',
     data: function (term, page) {
        var targetname = $(this).attr('name');
        var target = targetname.slice(targetname.indexOf("[")+1, targetname.indexOf("]"));
       return {
         targettype: "search",
         target: target,
         search: term
       };
     },
     results: function (data, page) {
       return { results: data };
     }
   }
 });
}
AjaxCombo(".ajaxselect", "includes/linkedcontrol.php", false);
AjaxCombo(".ajaxmultiselect", "includes/linkedcontrol.php", true);

Ajax コンボは正常に動作しますが、初期値のロードのみに問題があります。以下のコードを試しましたが、動作しませんでした:

initSelection : function (element, callback) {
    var elementText = $(element).attr('data-initvalue');
    callback(elementText);
}

PHP からの私の HTML は次のように返されます。

<input name='header[country]' class='ajaxselect'  data-initvalue='[{"id":"IN","name":"India"}]' data-placeholder='Select Country' value='' />

値がphpから入力されていることがわかります.jqueryだけに問題があります。コントロール内の私の値は として表示されUS | United States of Americaます。formatオプションを使用せずに、このフォーマットをデフォルトとして取得するためにselect2ソースを編集したと思います。

デフォルト値を入力するのを手伝ってくれる人はいますか? 前もって感謝します。

編集:この質問は Select2 バージョン <4.0 に関するものです。このオプションは v4.0 から削除され、よりシンプルになりました。

4

12 に答える 12

24

多分これはあなたのために働きます!! これは私のために働く...

initSelection: function (element, callback) {

            callback({ id: 1, text: 'Text' });
}

コードのスペルが正しいことをよく確認してください。私の問題は にありましたinitSelection。initselection

于 2014-01-16T19:19:17.690 に答える
15

新しいバージョンに更新:

ここからこのソリューションを試してくださいhttp://jsfiddle.net/EE9RG/430/

$('#sel2').select2({
multiple:true,
ajax:{}}).select2({"data": 
     [{"id":"2127","text":"Henry Ford"},{"id":"2199","text":"Tom Phillips"}]});
于 2013-12-25T09:48:30.127 に答える
14

Ravi、4.0.1-rc.1 の場合:

  1. <option>内のすべての要素を追加します<select>。
  2. init 関数の$element.val(yourarray).trigger("change");後に呼び出します。select2

HTML:

<select name="Tags" id="Tags" class="form-control input-lg select2" multiple="multiple">
       <option value="1">tag 1</option>
       <option value="2">tag 2</option>
       <option value="3">tag 3</option>
 </select>

JS:

var $tagsControl = $("#Tags").select2({
        ajax: {
            url: '/Tags/Search',
            dataType: 'json',
            delay: 250,
            results: function (data) {
                return {
                    results: $.map(data, function (item) {
                        return {
                            text: item.text,
                            id: item.id
                        }
                    })
                };
            },
            cache: false
        },
        minimumInputLength: 2,
        maximumSelectionLength: 6
    });

    var data = [];
    var tags = $("#Tags option").each(function () {
        data.push($(this).val());
    });
    $tagsControl.val(data).trigger("change");

この問題は報告されましたが、まだ開かれています。 https://github.com/select2/select2/issues/3116#issuecomment-146568753

于 2015-11-11T23:10:53.173 に答える
5

追加しました

initSelection: function (element, callback) {

      callback({ id: 1, text: 'Text' });
}

だけでなく

.select2('val', []);

最後に。

これで私の問題は解決しました。

于 2015-01-07T13:15:56.657 に答える
1 
var elem = $("#container").find("[name=elemMutliOption]");
for (var i = 0; i < arrDynamicList.length; i++)
{
   elem.find("option[value=" + arrDynamicList[i] + "]").attr("selected", "selected");
}
elem.select2().trigger("change");

これは、ページ内の複数のセクションに同じビューを使用している場合に機能します。つまり、ページのデフォルトを自動設定する場合と同じように機能するか、EDIT ページの方が適切です。

「FOR」は、既存のオプションがすでに DOM にロードされている配列を通過します。

于 2016-02-24T14:03:56.197 に答える
0

遅い:(しかし、これで問題は解決すると思います。

 $("#controlId").val(SampleData [0].id).trigger("change");

データバインディング後

 $("#controlId").select2({
        placeholder:"Select somthing",
        data: SampleData // data from ajax controll
    });
    $("#controlId").val(SampleData[0].id).trigger("change");
于 2018-01-11T20:54:29.623 に答える