2016-01-30 3 views
0

В select2 "загружаемых удаленных данных" example ответ json содержит больше информации, чем «данные массива загрузки» example2.Select2 load local json с несколькими ключами

Возможно ли загрузить локальный файл json, содержащий данные массива, как показано ниже и сделать все ключи доступными/доступными для поиска, используя select2, например. текст, текст2 и текст3?

var data = [ 
    { 
    id: 0, 
    text: 'enhancement', 
    text2: 'text2', 
    text3: 'text3' 
    }, 
    { 
    id: 1, 
    text: 'bug', 
    text2: 'text2', 
    text3: 'text3' 
    }, 
    { 
    id: 2, 
    text: 'duplicate', 
    text2: 'text2', 
    text3: 'text3' 
    }, 
    { 
    id: 3, 
    text: 'invalid', 
    text2: 'text2', 
    text3: 'text3' 
    }, 
    { 
    id: 4, 
    text: 'wontfix', 
    text2: 'text2', 
    text3: 'text3' 
    } 
]; 

$(".js-example-data-array").select2({ 
    data: data 
}) 

<select class="js-example-data-array"></select> 

ответ

0

Преамбула: Я не пользуюсь этой библиотекой.

Взгляните на документацию по 3.5.3. В нем перечислены пользовательские сопоставления, которые вы можете написать для сопоставления данных на основе атрибутов, добавленных в элементы выбора. 4.0 есть обертки, которые вы можете добавить к этим пользовательским сопоставлениям, чтобы обновить их.

Эти пользовательские соединители могут просматривать любые данные вашего объекта.

Поскольку страница параметров в документах в настоящее время переписывается, посмотрите на https://select2.github.io/options-old.html и найдите опцию «совпадение». не используйте здесь пример: https://select2.github.io/examples.html#matcher , потому что он передает вам только тот термин, который был введен, и текст опции.

, когда вы передаете параметры своему инициализатору select2, сделайте примерно следующее: (обратите внимание, что это непроверенный код).

$(".js-example-data-array").select2({ 
     data: data, 
    matcher: function (params, data) { 
     // If there are no search terms, return all of the data 
     if ($.trim(params.term) === '') { 
     return data; 
     } 

     // `params.term` should be the term that is used for searching 
     // `data.text` is the text that is displayed for the data object 

     // here include conditions for each of the attributes you want to match on 
     // I've included text and text2 as an example 
     if (data.text.indexOf(params.term) > -1 || data.text2.indexOf(params.term) > 1) { 
     return data; 
     } 

     // Return `null` if the term should not be displayed 
     return null; 
    } 
}) 

Удачи.

Смежные вопросы