추가 생성자 매개 변수를 사용하여 kendoGrid 확장하기

Question

다음은 example입니다. kendoGrid에 플러그인을 쓰거나 더 나은 확장자를 쓰려고합니다. 내 목표는 kendoGrid에 추가 구성 매개 변수를 장착하는 것입니다 (예 : format이라는 콜백 함수). 데이터 변경시 사용자 지정 조건부 서식을 제공합니다.

예를 들어, kendoGrid 생성자가 그대로 유지되고 새로운 매개 변수를 채택하기를 바라는 반면,이 예제는 실제로 새로운 위젯을 구성한다는 점이 무엇입니까? kendoGrid의 모든 호출을 kendoMyPlugin으로 변경하지 마십시오. 그것은 가능한가?

Answer 1

링크의 예는 위젯 클래스를 확장합니다. 이것은 모든 Kendo UI 위젯을 파생시키는 기본 클래스입니다. 귀하의 경우, 키노 그리드를 확장하고 거기에서 기능을 추가하고자합니다. init 메소드의 시그니처는 Kendo 내부에서 호출되기 때문에 변경할 수는 없지만 필요한 옵션을 쉽게 사용자 정의 할 수 있습니다. 기본 패턴은 다음과 같습니다.

(function ($, undefined) { 

    if (!kendo.ui.MyGrid) {  

     var base = kendo.ui.Grid; 

     var MyGrid = base.extend({ 

      init: function (element, options) { 

       // Call the base class's init. 
       base.fn.init.call(this, element, options); 

       // Add initialization... 
       this.myField1 = options.myOption1; 

       // If you want to watch changes in the dataSource 
       // attached to the grid, you could use this. Of 
       // course you don't even need to subclass to do this 
       // but you get the point. 
       this.dataSource.bind("change", function(e) { 
        if (that.options.myCallback) { 
         that.options.myCallback.call(that, e); 
        } 
       }; 
      }, 

      // Add default options... 
      options: { 
       myOption1: "Hello", 
       myOption2: "World", 
       myCallback: undefined, 
      } 

      // Add events... 
      events: [ 
       "myEvent1", 
       "myEvent2" 
      ], 

      // Add fields... 
      myField1: "Goodbye", 

      // Add methods... 
      myMehod: function (a, b, c) { 
       // Do something... 
      } 
     } 

     // Register the new widget. 
     kendo.ui.plugin(MyGrid); 
    }  
})(jQuery); 

이제 MyGrid에는 추가 된 기능과 함께 Grid의 모든 기능이 추가되었습니다. 그리드와 마찬가지로 새 인스턴스를 만듭니다.

$("#someElement").kendoMyGrid({ 
    // Add options for standard kendo Grid and your new options... 
    myCallback: function (e) { 
     alert(e.action); 
    } 
});