jQuery 색이 지정된 행을 사용하는 Datatable

일부 행은 회색 배경색을 사용하여 비활성화됨을 의미하는 jQuery 데이터 테이블을 만들어야합니다. 행은 해당 MySQL 테이블의 'status'열이 0 인 경우에만 회색 배경을 가질 수 있습니다.jQuery 색이 지정된 행을 사용하는 Datatable

아래 코드를 살펴보십시오. 열 '10'이 숨겨져 있습니다. 여기에는 status 값이 포함되어 있습니다. 값이 0이면 행의 배경색이 달라야합니다. 그러나 이것은 효과가 없습니다. 오류 메시지가 없습니다. 어떤 아이디어?

$(document).ready(function(){ 
       $('#newspaper-b').dataTable({ 
       "sPaginationType":"full_numbers", 
       "aaSorting":[[4, "asc"]], 
       "aoColumns": [null,null,null,null,null,null,null,null,null,null, 
          {"bSearchable": true, "bVisible": false},null,null], 
       "bJQueryUI":true, 
       'fnRowCallback': function(nRow, aData, iDisplayIndex, iDisplayIndexFull) { 
        if(aData[10]=="0"){ 
         nRow.className = "disactivatedRow"; 
        } 
        return nRow; 
       } 
       });

CSS

.disactivatedRow td { 
    background-color:#ffbba9 !important; 
    color: #e6e6fa; 
} 
#newspaper-b { 
    border-collapse: collapse; 
    border-color: #B7DDF2; 
    border-style: solid; 
    border-width: 1px; 
    font-family: Arial,Helvetica,sans-serif; 
    font-size: 11px; 
    margin: 0; 
    text-align: left; 
    width: 480px; 
} 
#newspaper-b th { 
    background: none repeat scroll 0 0 #EBF4FB; 
    border-color: lightgray; 
    font-size: 11px; 
    font-weight: bold; 
    padding: 15px 10px 10px; 
} 
#newspaper-b tbody tr td { 
    background: none repeat scroll 0 0 #FFFFFF; 
} 
#newspaper-b td { 
    border-top: 1px dashed #FFFFFF; 
    color: #000000; 
    padding: 10px; 
} 
#newspaper-b tbody tr:hover td { 
    background: none repeat scroll 0 0 #FFCF8B; 
    color: #000000; 
} 
#newspaper-b tbody tr.selected td { 
    background: none repeat scroll 0 0 #FFCF8B; 
    color: #000000; 
}

출처

2012-05-26 Gusgus

CSS는 "markedrow"규칙이 필요합니다. –

@Disis Chmel : 예, CSS 스타일이 정의되어 있는지 확인하십시오. 죄송합니다. 게시하지 않았습니다. 업데이트를 확인하십시오. 고마워. – Gusgus

행 콘텐츠 따라서 배경이없는, TD 대신 착색한다 :

.disactivatedRow td { 
    background-color:#ffbba9 !important; 
    color: #e6e6fa; 
}

아직도 내가 당신을 건의 할 것입니다 해결되지 않으면 if() 외부의 console.log (aData [10]). console.log가 작동하려면 Chrome/Firefox를 사용하고 F12를 통해 콘솔 출력을 찾고 aData [10]에 포함 된 내용을 확인합니다. 어쩌면 aData [9]가 필요합니다 (프로그래머는 0부터 계산할 수 있습니다).

출처

2012-05-26 20:11:13

감사합니다. 데이터 [10]이 정확합니다. 이미 확인 했어. 나는 당신의 해결책을 시도했지만 여전히 행은 색깔이 없습니다. 업데이트 된 게시물에서 내 전체 CSS를 살펴보십시오. – Gusgus

다음 단계는 "요소 검사"를 사용하는 것입니다 (Firebug를 설치 한 후 Firefox에서 Chrome에서 즉시 사용). 셀을 마우스 오른쪽 버튼으로 클릭하고 "요소 검사"를 선택한 다음 오른쪽 창에서 잘못된 계단식 스타일을 추적합니다. 그러나 일반적으로 "! important"가 가장 우선 순위가 높기 때문에 로우가 올바른 클래스 이름을 얻지 못하는 문제가 발생할 수 있습니다. 검사 할 때 여전히 볼 수 있습니다 (생성 된 HTML이 표시된 왼쪽 창). –

예 그렇습니다. 상태가 0 인 행을 선택하면 'disactivatedRow'스타일이 적용되지 않습니다 (Firebug의 CSS 창). 그렇다면이 문제를 어떻게 해결할 수 있습니까? – Gusgus

jQuery 색이 지정된 행을 사용하는 Datatable

답변

관련 문제