Question

我正在创建一个包含select2下拉列表的列表。请参考下图：

HTML代码如下所示：

<table class="table table-hover table-borderless" id="tabpro">
<tbody class="list">
  <tr class="t-row">
     <td class="name" style="width: 370px;padding-left:50px;">
        <h5>BR-2C-4567</h5>
     </td>
     <td class="driver-name">
        <form class="edit_truck" id="edit_truck_1" action="/trucker/trucks/1/update_driver.1" accept-charset="UTF-8" method="post">
           <input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="_method" value="put" /><input type="hidden" name="authenticity_token" value="c113UiPfI8Jk72/iivm9qJhIys8udhgaynEJUaMHjkTqpZIm+9R1VYbe1QN5+0jrGReMOb2E9w75fsvI37Mh/w==" />
           <span class="select2box">
              <select class="select-example" name="truck[driver_id]" id="truck_driver_id">
                 <option value="">No drivers selected</option>
                 <option value="1">Shubham</option>
                 <option selected="selected" value="2">XYZ</option>
              </select>
           </span>
           <input type="submit" name="commit" value="Update Driver" class="btn btn-default" />
        </form>
     </td>
  </tr>
  <tr class="t-row">
     <td class="name" style="width: 370px;padding-left:50px;">
        <h5>sasadga</h5>
     </td>
     <td class="driver-name">
        <form class="edit_truck" id="edit_truck_2" action="/trucker/trucks/2/update_driver.2" accept-charset="UTF-8" method="post">
           <input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="_method" value="put" /><input type="hidden" name="authenticity_token" value="yy8hpB+cBT2bcyyYBn+ZmLHUT+nBVGg0QPwytmtZ8QVS18TQx5dTqnlClnn1fWzbMIsJH1KmhyBz8/AvF+1evg==" />
           <span class="select2box">
              <select class="select-example" name="truck[driver_id]" id="truck_driver_id">
                 <option value="">No drivers selected</option>
                 <option selected="selected" value="1">Shubham</option>
                 <option value="2">XYZ</option>
              </select>
           </span>
           <input type="submit" name="commit" value="Update Driver" class="btn btn-default" />
        </form>
     </td>
  </tr>
  .... 
 </table>

我可以使用listjs插件搜索车辆。但是如何搜索驱动程序？我尝试使用此代码，但它不起作用。（我是javascript，jQuery初学者）。

$('.searchDriver').keyup(function(){
      var srchTerm = $(this).val(),
          rows = $('tbody.list').find('tr'),
          opt = $('.select2box').find('select option:selected');

      if (srchTerm.length > 0) {
          rows.stop().hide();
          if($('.select2box').find('select option:selected').text().indexOf('x') == -1){
            opt.closest('tr').stop().show();
          }
      }else {
            rows.stop().show();
        }  
    });

请分享一个工作示例/指导我完成此任务。

在一列中使用select2下拉列表搜索表

0 个答案: