Убедитесь, что значение li содержит одно или несколько значений - PullRequest
0 голосов
/ 16 апреля 2020

У меня есть этот скрипт для фильтрации моих значений, но он работает, только если значение одно, а если оно многократное, оно не распознает его.

Мой код: CodePen

<li id="image_li_<?php echo $row['id']; ?>" class="ui-sortable-handle card" data-filtertext="<?= $parse_to_tag($row['id']);?>">

Например. выберите значение = "4" OK / выберите значение = "1 4 8" не фильтруйте.

<li data-filtertext="4 8 10"> //not filter when select 4 or 8 or 10

<li data-filtertext="4"> // working fine.

Но мне нужно фильтровать, когда значение li содержит"1 или 4 или 8 "

   $('#filter_categoria').change(function(){
    var value = $(this).val();
    $(".reorder_ul").find("li").hide()
        $.each($("ul").find("li"),function(){
            if($(this).data('filtertext') == value)
                $(this).show();
        });

    });

Ответы [ 2 ]

0 голосов
/ 16 апреля 2020

Надеюсь, это поможет:

$('#filter_categoria').change(function(){
    var value = $(this).val();
    $(".reorder_ul").find("li").hide()
        $.each($("ul").find("li"),function(){
            let filterText = $(this).data('filtertext'),
            filterArray = $(this).data('filtertext').split(" ");
            filterArray.forEach(function(item){
                if(item == value){
                    $(this).show();
                    break;
                }
            });

        });

    });
0 голосов
/ 16 апреля 2020

Я думаю, что вы можете достичь своей цели, разделив список чисел на " ", а затем проверив, включено ли требуемое значение (должно быть строкой) в список, например:

if($(this).data('filtertext').toString().split(" ").includes(String(value)))

  $('#filter_categoria').change(function(){
    var value = $(this).val();
    $(".reorder_ul").find("li").hide()
    $.each($("ul").find("li"), function(){
      if($(this).data('filtertext').toString().split(" ").includes(String(value)))
        $(this).show();
    });
 });
 
 $('#filter_categoria').change();
ul li {
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select id="filter_categoria">
  <option>4</option>
  <option>10</option>
  <option selected>5</option>
</select>

<ul class="reorder_ul">
<li data-filtertext="4 8 10">4 8 10</li>
<li data-filtertext="4">4</li>
<li data-filtertext="5">5</li>
</ul>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...