2014-01-17 2 views
2

데이터 관리를 위해 Kendo UI Grid Edit 및 Delete 명령을 사용하고 있습니다.Kendo UI Grid on 취소 이벤트

내가 실행중인 문제는 삭제 단추에 적용해야하는 사용자 지정 스타일이 있다는 것입니다. DataBound 이벤트에 클래스를 추가 할 수 있지만 사용자가 데이터를 편집하려고하면 스타일이 사라지고 기본 Kendo UI 스타일로 돌아갑니다.


JQuery와 스타일을

function onRowBound(e) { 
    $(".k-grid-delete").removeClass("k-button k-button-icontext").addClass("btn btn-danger"); 
} 

검도 MVC 이벤트

columns.Command(command => command.Edit()).Title("Edit"); 
columns.Command(command => command.Destroy()).Title("Remove") 
.........  
.Events(e => 
     { 
      e.DataBound("onRowBound"); 
      e.Cancel("onRowBound"); 
      e.Edit("onRowBound"); 
     })) 

내가 취소 이벤트에 같은 방법으로 불을 가지고 시도를 추가하는 데 사용하지만 스타일은 여전히 ​​돌아갑니다 기본값으로 설정합니다. "ClientTemplate"기능을 사용하지 않고 스타일을 설정할 수있는 방법이 있습니까?

답변

4

kendoUI가 스타일을 변경하지 못하게하는 메커니즘이 없기 때문에 검도 후 버튼 스타일을 변경하기 위해 SetTimeout 함수를 사용하는 것이 유일한 방법입니다. 그런 당신의 onRowBoundFunction 변경 :

function onRowBound(){ 
    setTimeout(function(){ 
      $(".k-grid-delete").removeClass("k-button k-button-icontext").addClass("btn btn-danger"); 
    },1); 
} 

작업 JSFiddle을 : http://jsfiddle.net/a6Ek2/10/

+1

이것은 나를 위해 일했습니다. 나는 그것에 대해 갈 가장 좋은 방법이 아닌 것처럼 느껴지 긴하지만 그것이 실제로 작동하는 유일한 방법 인 것 같습니다. 감사합니다 – sevargdcg

+0

나를 위해 일했지만 조금 해킹 것 같습니다? 당신의 모든 것을 어떻게 테스트 했습니까? – GP24

-1

MVC에 대해 잘 모르겠지만, 이렇게 단추 스타일을 지정할 수 있습니다. 아래의 코드는 그리드의 열 정의에서 가져온 것입니다. className 및/또는 attributes 속성을 사용할 수 있습니다.

{ 
    command: [{ text: "Edit", click: showDetails, className: "rebtn" }, 
    { text: "Request New Engagement", click: showEngagement }], 
     attributes: {style:"padding:10px"}, 
     title: " ", 
     width: "200px" 

} 
0

제 생각에는 올바른 방법은 검도 클래스를 제거하지 말고 원하는 스타일을 변경하는 것입니다. 그런 다음 다른 그리드를 원한다면 클래스를 수동으로 다시 변경할 필요가 없습니다. 그래서, 당신의 CSS에서 당신은 쉼표를 사용하고 같은 것을 쓸 수 있습니다 : 당신이 exacly보고 검도 버튼을 몇 .k 버튼의 속성을 변경해야 할 것을 알고

.btn, .k-grid .k-button { 
    your properties 
} 

.btn-danger, .k-grid .k-button { 
    your properties 
} 

을하지만, 당신이 원하는하지만 난 몰라 더 좋은 방법.

+0

이 나는 ​​버튼의 트위터 부트 스트랩 스타일로 사용하고있는 스타일 때문에 정말 좋은 옵션이 아닙니다. – sevargdcg

관련 문제