1

私は 3.5 -> 4.0 へのアップグレードをもう一度行っており、このユースケースは「ほぼ」以前と同じように機能しています。私が今行き詰まっているのは、特定のオプションを ajax 結果リストに常に追加する方法です。

これが私が今持っているものです：

html:

<select id="vedit-filter" name="settings[filter]" class="form-control select2">
    <option value="default" selected="">default</option>
</select>

js:

$("#vedit-filter").select2({
    placeholder: "Select or enter application...",
    allowClear: true,
    multiple: false,
    tags: true,
    ajax: {
        dataType: 'json',
        delay: 1000,
        type: 'post',
        url: '/process/get_application_list.php',
        data: function (term, page) {
            return {
                term: term, // search term
                page_limit: 25, // page size
                page: page // page number
            };
        },
        results: function (data, page) {
            var more = (page * 25) < data.total; // whether or not there are more results available
            return {
                results: data.results,
                more: more
            };
        }
    }
});

これにより、最初に選択されたオプションとして「デフォルト」がロードされます。ユーザーがこれを変更すると、それはなくなります。必要に応じて、最初の選択に戻す方法が必要です。ajax から返された結果にオプションとして含める唯一の方法はありますか? または、js側でこれを行う方法はありますか?

アップデート：

デフォルトの選択は常に動的ですが、この例では「デフォルト」の値/名前を使用しています。

<select id="vedit-filter" name="settings[filter]" class="form-control select2">
    <option value="default" selected="">default</option>
</select>

次にjsで：

var default_filter = $("#vedit-filter").val(); //get the default loaded from the html

placeholder: {
  id: default_filter, // or whatever the placeholder value is
  text: default_filter // the text to display as the placeholder
},
4

1 に答える 1

1

私は最近GitHub でこれを説明しましたが、それがどれほど重大な変更であるかを認識していませんでした。

必要に応じて、最初の選択に戻す方法が必要です。

Select2 はplaceholderオプションを提供します。これにより、ユーザーがまだ選択されていない場合に、「項目を選択してください」などのプレースホルダーを指定できます。デフォルトで最初のオプションを選択する (これはブラウザーによって行われます)をサポートするために<select>、Select2 は「プレースホルダー」<option>が存在することを必要とします。これは、プレースホルダーを表示する必要があるかどうかを決定するために Select2 が使用するオプションとしても機能します。

オプションに加えてplaceholder、Select2 を使用すると、ユーザーは選択したオプションを削除して、選択をプレースホルダー オプションに戻すこともできます。これはオプションで有効にできallowClearます。

ajax から返された結果にオプションとして含める唯一の方法はありますか? または、js側でこれを行う方法はありますか?

あなたの例では、プレースホルダーオプションをvalueセットで使用しています。Select2 はデフォルトで空白/空であることを想定しているためvalue、プレースホルダーを検出するときに何を探すべきかを Select2 に指示する必要があります。placeholderこれは、チェック時に Select2 が使用するデータ オブジェクトを渡すことで実行できます。

placeholder: {
  id: 'default', // or whatever the placeholder value is
  text: 'Select or enter application...' // the text to display as the placeholder
}

valueこれは、が に設定されている場合にプレースホルダーを表示するように Select2 に指示defaultします。これは、例ではプレースホルダー/デフォルト オプションのように見えます。

私が今行き詰まっているのは、特定のオプションを ajax 結果リストに常に追加する方法です。

ここで XY の問題は解決したと思いますが、AJAX の結果リストに新しいオプションを追加することは、オーバーライドするのと同じくらい簡単であることに注意してくださいprocessResults。これはprocessResults、データ オブジェクトのリストが Select2 に直接渡されるためです。これにより、リストに新しいオプションを挿入するための安全な場所が提供されます。

.push追加のデータ オブジェクトを に追加し、resultsそれらを Select2 に戻すだけです。

于 2015-05-13T14:41:45.327 に答える