2009-05-20 3 views
0

이것은 진행중인 프로젝트이며 나는 거의 완료되었습니다. 나는 jQueryt 용 tablesorter 플러그인을 기반으로 사용자 정의 테이블 분류기를 개발 해왔다. 감사합니다.테이블 헤더에 메타 데이터 파서를 추가하는 것

<th class="blue_bg"><a rel = "Header" href="#" title="Sort column in decending order" class="">Seats Available</a></th> 

내가 특정 열을 정렬 해제 할 수있는 인라인 메타 데이터 파서를 추가하고 싶습니다 : 내 마지막 질문은 다음과 같이 나는 테이블 헤더가, 이것이다.

//th without a class automatically get sorting disabled 
    $("th[class='']").each(function(){ 
    $(this).addClass("{sorter: false}"); 
}); 

나는 또한 열 수 있는지 여부를 나타내는 특정 문자열과 검색을 통과 한이 다음과 같이 저는 현재 클래스하지 않고, 각각의 헤더를 통과 이송 기능을 가지고 있고, 파서를 추가 정렬에서 비활성화 : 사용자가 기본적으로 또는 사용자 정의 문자열로, 달리 명시하지 않는 한, 그래서

//Add disabling parser to each header with a disable class 
    $("th[class*='csuci.sortable.false']").each(function(){ 
    $(this).removeClass("csuci.sortable.false").addClass("{sorter: false}"); 
}); 

는 기본적으로, 나는 그것을 설치를하려면, 열을 사용할 수 없습니다 정렬 것입니다. 정리하자면 클래스가 전혀없는 열에 대해서는 정렬을 사용하지 않도록 설정했으며 사용하지 않는 문자열을 지정하는 클래스가 있습니다. 또한 사용자가 헤더에 다른 클래스를 가질 수있는 세 번째 조건을 원합니다.이 예제에서 사용자는 클래스의 배경을 파란색으로 지정합니다. 그러나이 예제 헤더에 사용하지 않는 구문 분석기를 추가하는 데 필요한 구문을 모르겠습니다. 도와 주셔서 감사합니다. 미리 감사드립니다.

UPDATE : 여기 whatt의의를 기반으로 파서를 추가하거나,에서 일 클래스 속성없는 내 완성 기능은 다음과 같습니다

$(function(){ 
    //Add disabling parser to each header with a disable class 
    $("th[class*='csuci.sortable.false']").each(function(){ 
     $(this).removeClass("csuci.sortable.false").addClass("{sorter: false}"); 
    }); 

    //th without a class automatically get sorting disabled 
    $("th[class='']").each(function(){ 
     $(this).addClass("{sorter: false}"); 
    }); 

    //Add parser to each table that has a class="csuci.sortable." 
    $("th[class*='csuci.sortable.date']").each(function(){ 
     $(this).removeClass("csuci.sortable.date").addClass("{sorter: 'usLongDate'}"); 
    }); 

    $("th[class*='csuci.sortable.percent']").each(function(){ 
     $(this).removeClass("csuci.sortable.date").addClass("{sorter: 'percent'}"); 
    }); 

    $("th[class*='csuci.sortable.ip']").each(function(){ 
     $(this).removeClass("csuci.sortable.date").addClass("{sorter: 'ip-address'}"); 
    }); 

    $("th[class*='csuci.sortable.url']").each(function(){ 
     $(this).removeClass("csuci.sortable.date").addClass("{sorter: 'url'}"); 
    }); 

    $("th[class*='csuci.sortable.money']").each(function(){ 
     $(this).removeClass("csuci.sortable.date").addClass("{sorter: 'currency'}"); 
    }); 

    $("th[class*='csuci.sortable.time']").each(function(){ 
     $(this).removeClass("csuci.sortable.date").addClass("{sorter: 'time'}"); 
    }); 
}); 

답변

1

그래서 당신과 함께 분류기를 사용하려는 경우이 무엇인지? 분류기가 활성화 된 유일한 경우는 직접적인 참 플래그입니다. not을 사용해야 할 수도 있습니다.

$("th:not([class*='csuci.sortable.true'])").each(function(){ 
    $(this).addClass("{sorter: false}"); 
}); 

정렬은 진정한 플래그에 의해 활성화하고 다음 모든 열을 일치 플래그를 설정하는 조건을 사용할 수있는 모든 요소의 분류기를 설정해야됩니다.

$("th").each(function(){ 
    var sortEnabled = $this.hasClass('csuci.sortable.true'); 
    $(this).addClass("{sorter: "+sortEnabled+"}"); 
}); 
+0

안녕하세요 gradbot, 정말로 추가 할 부울 클래스가 없습니다. 각 탐색 함수를 찾기 위해 하드 코딩하는 임의의 문자열입니다. 그런 다음 클래스에있는 문자열을 기반으로 정렬 구문 분석기를 추가합니다. – kingrichard2005

+0

jQuery 데이터 사용을 고려 했습니까? http://docs.jquery.com/Core/data#namevalue – gradbot

0

내가 단순히 모든 테이블의 헤더에 해제 파서를 추가하는 시작 부분에 탐색 기능을 추가,이 주위에 방법을 찾기 위해 관리, 각 연속 통과는 하드 코딩에 대한 해제 파서, 수표를 제거 문자열을 읽고 필요한 파서를 추가합니다.

$(function(){ 

    //Add disable parser to all headers 
    $("th").each(function(){ 
     $(this).addClass("{sorter: false}"); 
    }); 

    //Add disable parser to each header with a disable class 
    $("th[class*='csuci.sortable.false']").each(function(){ 
     $(this).removeClass("csuci.sortable.false").addClass("{sorter: false}"); 
    }); 

    //th without a class automatically gets sorting disabled 
    $("th[class='']").each(function(){ 
     $(this).addClass("{sorter: false}"); 
    }); 

    //Add parser to each table that has a class="csuci.sortable.date" 
    $("th[class*='csuci.sortable.date']").each(function(){ 
     $(this).removeClass("{sorter: false}"); 
     $(this).removeClass("csuci.sortable.date").addClass("{sorter: 'usLongDate'}"); 
    }); 
    //Add parser to each table that has a class="csuci.sortable.percent" 
    $("th[class*='csuci.sortable.percent']").each(function(){ 
     $(this).removeClass("{sorter: false}"); 
     $(this).removeClass("csuci.sortable.percent").addClass("{sorter: 'percent'}"); 
    }); 
    //Add parser to each table that has a class="csuci.sortable.ip" 
    $("th[class*='csuci.sortable.ip']").each(function(){ 
     $(this).removeClass("{sorter: false}"); 
     $(this).removeClass("csuci.sortable.ip").addClass("{sorter: 'ip-address'}"); 
    }); 
    //Add parser to each table that has a class="csuci.sortable.url" 
    $("th[class*='csuci.sortable.url']").each(function(){ 
     $(this).removeClass("{sorter: false}"); 
     $(this).removeClass("csuci.sortable.url").addClass("{sorter: 'url'}"); 
    }); 
    //Add parser to each table that has a class="csuci.sortable.money" 
    $("th[class*='csuci.sortable.money']").each(function(){ 
     $(this).removeClass("{sorter: false}"); 
     $(this).removeClass("csuci.sortable.money").addClass("{sorter: 'currency'}"); 
    }); 
    //Add parser to each table that has a class="csuci.sortable.time" 
    $("th[class*='csuci.sortable.time']").each(function(){ 
     $(this).removeClass("{sorter: false}"); 
     $(this).removeClass("csuci.sortable.time").addClass("{sorter: 'time'}"); 
    }); 
}); 

아마도 가장 깨끗한 방법은 아니지만 작동합니다. StackOverflow에서 jQuery의 작동에 대한 귀중한 통찰력을 제공해 주신 모든 분들께 진심으로 감사드립니다.

관련 문제