2017-03-25 1 views
1

Slickgrid에서 행에 취소 선을 적용하는 방법은 무엇입니까?Slickgrid 행 취소 선

'text-decoration'스타일을 사용해 보았지만 스타일이 적용되지 않았습니다. 내가 행에 스타일을 적용하는 코드 아래에 시도

data.getItemMetadata = function (row) { 

    if (this[row].title == 'Task 5'){ 
     return { 
      cssClasses: 'highlight' 

     }; 
    } 
    return null; 
} 

CSS

.highlight { 
    text-decoration: line-through; 
} 

답변

1

몇 가지 :

1) 당신이 데이터를 참조하고있는 방법에서 보이는 당신 ' JSON 객체를 데이터로 직접 사용하기. 그렇게 할 수는 있지만 행 메타 데이터를 사용하려는 경우는 아닙니다.

2) 그래서 당신은 example-4-model 당으로 dataView로를 사용해야하고, 추가 getItemMetadata에 액세스 할 수있는 :

dataView.getItemMetadata = function (row) { 
    var v = this.getItem(row); 
    if (v.title == 'Task 5'){ 
    return { 
     cssClasses: 'highlight' 

    }; 
    } 
    return null; 
} 

3) 그렇다하더라도 (내가 위의 코드를 테스트는 클래스를 추가하지 않습니다) 행의 클래스는 열 데이터에 취소 선을 추가하지 않습니다. 이됩니다

.highlight > .slick-cell { 
    text-decoration: line-through; 
}  

당신은 당신이 원하는 것을 얻기 위해, 또는 최후의 수단으로 오히려 행보다 열 메타 데이터 속성을 추가 할 수있는 다른 CSS 트릭을 사용할 수 있습니다.

마지막으로, my slickgrid repo을 확인하십시오.이 항목은 사용자 정의하지 않고 MLeibman 분기를 실행하는 가장 최근의 포크입니다 (버그 수정 및 사소한 개선 사항 만 있음). 많은 버그가 수정되었으며 jQuery 1.8+, 2.x 및 3.x로 완전히 테스트되었습니다.