在select2的select屬性上搜索

是否可以在select2的文本和另一個屬性的組合上進行搜索？例如，可以對「數據測試」和文本下面的兩個值的用戶的搜索：在select2的select屬性上搜索

<option value="185" data-test="5">Test</option> 
<option value="186" data-test="6">Test 2</option> 
<option value="187" data-test="7">Test 3</option>

使得搜索「試驗2」和「6」顯示相同的單選項？

這是在頁面加載時綁定的列表，因此無法在其他地方進行過濾。

謝謝 -

來源

2016-03-15 James F

這是足夠簡單 -

創建自定義匹配功能，類似於select2.js中的「匹配器」：

function customMatcher(params, data) { 
    // Always return the object if there is nothing to compare 
    if ($.trim(params.term) === '') { 
     return data; 
    } 

    ... OTHER MATCHING CODE 


    // Check if the text contains the term 
    if (original.indexOf(term) > -1) { 
     return data; 
    } 

    // Check if the data occurs 
    if ($(data.element).data('test').toString().indexOf(params.term) > -1) { 
     return data; 
    } 

    // If it doesn't contain the term, don't return anything 
    return null; 
}

我添加了「數據（ '試驗'）」上面的功能，並更新了初始化：

$("#ddl").select2({ 
     matcher: customMatcher 
    });

巨大的。

來源

2016-03-16 15:54:34

-1

你將不得不在第二選擇我想工作，但你可以做一個簡單的if語句基於切換掉，如果發現像這樣的第一種方式：

$('button').click(function() { 
    var found = $("option[data-test='6']"); 

    if(typeof found == 'undefined'){ 
     found = $('option[text="Test 2"]'); 
    } 

    alert(found.val()); 

});

你將不得不添加一個按鈕。

<button >Clicky</button>

來源

2016-03-15 21:13:57 TylerT

您可以創建自己的自定義匹配，這裏就是你們的榜樣：

function matchStart (term, text, option) { 
     console.log($(option.element).data("test")); 
     if (text.toUpperCase().indexOf(term.toUpperCase()) == 0 || ($(option.element).data("test") !== undefined && $(option.element).data("test") == term)) { 
     return true; 
     } 

     return false; 
    } 

    $.fn.select2.amd.require(['select2/compat/matcher'], function (oldMatcher) { 
     $("select").select2({ 
     matcher: oldMatcher(matchStart) 
     }) 
    });

件事上，你可以在這裏https://select2.github.io/announcements-4.0.html#new-matcher找到它的文檔讓我知道，如果這適合您的問題

來源

2016-03-16 10:22:44 cralfaro

感謝您的支持！我已經看到了，但是試圖避免使用已棄用的函數，並且匹配器示例似乎是循環的。我最終找到了一個使用基本select2的好解決方案，如我提交的答案中所示。再次感謝！ –

我剛剛添加了選擇數據國家名稱（因爲它是國家選擇），這些國家在oryginal中只有這些國家的短標籤（例如GB，AF，PL）。然後在select2.js去功能匹配（參數，可以數據）發動對每一個按鍵，並寫道：

var dataAttr = String(data.element.getAttribute('data-country-name')); 
var termP = stripDiacritics(params.term).toUpperCase(); 
var org = stripDiacritics(dataAttr).toUpperCase(); 
if (org.indexOf(termP) > -1) { 
     return data; 
}

來源

2018-02-28 09:38:35

在select2的select屬性上搜索

回答

相關問題