두 번째 머리글 행과 두 번째 머리글 행에 다중 선택 드롭 다운이있는 tablesorter

Question

10 개 이상의 열이있는 테이블에 두 개의 머리글 행이 있습니다. 두 번째 헤더 행에는 거의 모든 열에 대한 드롭 다운이 선택되어 있습니다. 선택한 필드와 tablesorter에 대해 모든 열의 행을 정렬하기 위해 부트 스트랩 multiselect를 사용하고 있습니다. 처음에는 테이블에 행이없고 테이블 데이터가 ajax를 통해 동적으로 생성됩니다. 그래서 저는 아약스 함수에서 tablesorter를 호출하고 있습니다. tablesorter가 호출되기 전에 드롭 다운에서 선택할 수 있지만 일단 초기 데이터를 가져온 후에 호출되면 다른 옵션을 선택하려면 그렇게 할 수 없습니다. 드롭 다운이 작동하지 않습니다. 아래의 내 테이블이 어떻게 생겼는지의 예는 다음 JS에서

<table> 
<thead> 
<tr> 
<th>Vehicle</th> 
<th>Design</th> 
. 
. 
</tr> 
<tr> 
<th class="sorter-false"><select multiple="multiple" name="vehicle"><options here></select></th> 
<th class="sorter-false"><select multiple="multiple" name="design"><options here></select></th> 
. 
. 
</tr> 
</thead> 
<tbody> 
<tr><td></td><td></td>....</tr> 
<tr><td></td><td></td>....</tr> 
-- 
</tbody> 
</table> 

, 나는 분류기를 포함하여 시도 : 태그에서

$("#table").tablesorter({ 
           theme : 'blue', 
           headers: { 
            0: { sorter: "select" } 

           } 
          }) 

, 나는 다음과 같은 파일을 포함 아래처럼 선택

<script src="resources/js/bootstrap-multiselect.js"></script> 
<script src="resources/js/jquery.tablesorter.js"></script> 
<script src="resources/js/parser-input-select.js"></script> 
<link rel="stylesheet" type="text/css" href="resources/css/bootstrap-multiselect.css"> 
<link rel="stylesheet" type="text/css" href="resources/css/tablesorter-styles.css"> /*Changed name */ 

선택 드롭 다운으로 구성된 두 번째 머리글 행의 정렬을 비활성화하고 첫 번째 머리글 행에만 기반한 정렬을 사용하고 싶습니다. 선택 항목을 클릭하면 드롭 다운이 표시됩니다. 내가 어디로 잘못 가고 있는지 알려주세요.

Answer 1

두 번째 행의 경우 "tablesorter-ignoreRow"(cssIgnoreRow option으로 설정)의 클래스 이름을 추가하십시오.

각 셀에 class="sorter-false"을 추가 할 필요가 없습니다.

Here is a demo in the documentation using this class.