时间戳

首页 > 解决方案 > 在选择标签 phtml 中搜索

jquery - 在选择标签 phtml 中搜索

问题描述

我试图允许在选择标签中进行搜索，但我在 Internet 上发现只是按选项或 ID 进行搜索；我想在 value.descrizione_job (value.description_job) 上进行部分搜索。例如，如果我输入“生病”，如果里面有“生病”的描述必须在选择中出现

我附上我的 phtml 文件：

var tabella ='<select class="inserisciJob">';
    if(jobsInserted){
     tabella +='<option value=""></option>'; 
      $.each(jobsInserted, function( index, value ) {
        if (value.dettaglio_job != value.descrizione_job && value.dettaglio_job != null && value.option_text != null)
            if (value.dettaglio_job != '') {
                tabella += '<option id="'+value.codice_job+'" data-codice-job="'+value.codice_job+'" data-descrizione-job="'+value.descrizione_job+'" data-da-autorizzare="'+value.da_autorizzare+'" data-dettaglio-job="'+value.dettaglio_job+'">'+value.option_text+value.dettaglio_job+'</option>';
            }else{
                tabella += '<option id="'+value.codice_job+'" data-da-autorizzare="'+value.da_autorizzare+'" data-codice-job="'+value.codice_job+'" data-descrizione-job="'+value.descrizione_job+'" data-dettaglio-job="'+value.descrizione_job+'">'+value.option_text+'</option>';
            }
      });     
    }
    tabella +='</select>';
return tabella;

我试过了

$(document).ready(function() { 
    $("select").searchable(); 
});

但它不起作用

任何人都可以帮助我使用 jQuery 解决这个问题吗？

这是我想要的东西，但使用选择标签而不是数据列表：

$(document).ready(function(){
$("input").click(function(){
        $(this).next().show();
        $(this).next().hide();
    });

});
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<input list="brow">
<datalist id="brow">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>  
</body>
</html>

非常感谢安德里亚

标签： jqueryhtmltags

解决方案

如果要按数据属性搜索：

$("select").find('option[data-dettaglio-job="' + search+ '"]').val();

如果要在选项文本中搜索：

$('select').find('option[text="'+ search +'"]').val();

.val();允许您获取找到的选项的值。

您可以对属性使用多种类型的搜索：https ://api.jquery.com/category/selectors/attribute-selectors/ （包含、开始于、结束于...）

推荐阅读