2017-11-22 3 views
1

프로젝트 용 테이블 필터를 만들고 있습니다. 내 JsFiddle테이블 필터가 select2와 작동하지 않습니다.

$(document).ready(function() { 
    $('.filterable .filters input, select').keyup(function(e) { 
    var code = e.keyCode || e.which; 
    if (code == '9') return; 
    var $input = $(this), 
     inputContent = $input.val().toLowerCase(), 
     $panel = $input.parents('.filterable'), 
     column = $panel.find('.filters th').index($input.parents('th')), 
     $table = $panel.find('.table'), 
     $rows = $table.find('tbody tr'); 

    var $filteredRows = $rows.filter(function() { 
     var value = $(this).find('td').eq(column).text().toLowerCase(); 
     return value.indexOf(inputContent) === -1; 
    }); 

    $table.find('tbody .no-result').remove(); 
    $rows.show(); 
    $filteredRows.hide(); 

    if ($filteredRows.length === $rows.length) { 
     $table.find('tbody').prepend($('<tr class="no-result text-center"><td colspan="' + $table.find('.filters th').length + '">Deja, bet rezultatų nepavyko rasti</td></tr>')); 
    } 
    }); 
}); 

$("#street").select2({ 
    minimumInputLength: 3 
}); 

그리고 여기에 있습니다 : : 입력이 완벽하게 작동 필드,하지만 난 제대로 선택 2 필터를 작업을 관리 할 수 ​​없습니다, 그것은 바로 여기 내 jQuery 코드입니다 .. 작동하지 않습니다 https://jsfiddle.net/5202jsax/9/

미리 도움을 청합니다!

답변

0

Working Fiddle.

keyup 이벤트 목록 select 작동하지 않습니다, 당신은 단지처럼 선택 요소를 다루는 또한 change 이벤트를 추가했습니다

$('.filterable .filters input, select').on('input change', function(e) { 
    //Your logic HERE 
}); 

참고 : 내가 사용하고있어 input 이벤트는 사용자 입력을 처리 할 때보다 효율적이므로이 예제의 이벤트를 참조하십시오.

희망이 도움이됩니다.