KendoUI Grid - jak dodać klasę do wygenerowanej tabeli

Question

Generuję sieć KendoUI używając ajax dataSource. Tabela jest generowana i domyślnie nie ma klasy. Aby zachować spójność z resztą witryny, chciałbym dodać do niej klasę "interaktywną".

$("#pending_documents").kendoGrid({ 
    dataSource: { 
     transport: { 
      read: "/get-data?type=1" 
     }, 
     schema: { 
      data: "data", 
      total: "total" 
     }, 
     pageSize: 2, 
     serverPaging: true, 
     serverFiltering: true, 
     serverSorting: true, 
     reorderable: true 
    }, 
    height: 500, 
    filterable: { 
     extra: false 
/* 
, ui: "datetimepicker" // use Kendo UI DateTimePicker 
*/ 
    }, 
    sortable: true, 
    pageable: { 
     pageSize: 2  }, 
    columns: [...] 
}); 
    }); 

wiem, że mogę to zrobić za pomocą JQuery.addClass() metodę uruchamiania po siatka jest generowana, jednak jeśli istnieje sposób ustawiania go w konfiguracji sieci/konfiguracji?

Z góry dziękuję.

Answer 1

Domyślam się, że nie masz innego wyboru niż użycie addClass(). Nie można znaleźć niczego w ich dokumentacji na temat ustawiania siatki (nie kolumny siatki) htmlAttributes przy użyciu wbudowanej właściwości w JS. Próbowałem też bez powodzenia. Chyba że uznać je tak (C#):

@(Html.Kendo().TabStrip() 
    .Name("TabStrip") 
    .HtmlAttributes(new { @class = "newclass"}) 
) 

Ale jeśli naprawdę potrzebne w JS, to musisz to zrobić tak:

$("#pending_documents").kendoGrid({ 
dataSource: { 
    //code 
    } 
}).addClass("newclass"); 

Answer 2

Można to zrobić poprzez zdefiniowanie klasa w oryginalnym elementem, Kiedyś, jak:

<div id="pending_documents" class="your-class-name"> </div> 

Answer 3

tak jak ja to dodaj ją do moich kolumn w mojej konfiguracji, w sekcji attributes. W zależności od kolumny, którą chcesz ustawić klasę na wykonanie następujących czynności:

columns: [{ field: 'Name', title: 'Company Name', width: '250px',attributes: { 
        "class": "class1 class2" 
       }}, 
      . 
      . 
      . 
      . 
      . 
      . 
      .] 

ten sposób wszystkie elementy w kolumnie „Nazwa” (w moim przypadku) mają swoje zajęcia skonfigurować na inicjalizacji sieci. Nie trzeba robić dodatkowego jquery, aby dodać klasy. Próbowałem tego na początku. Robiąc to, sposób jquery (przy użyciu addClass) działał, dopóki nie spróbowałem posortować kolumn, następnie zepsuły się wiązania (prawdopodobnie z powodu magii, którą wykonywaliśmy w implementacji). Po wykonaniu tego, tak jak powyżej, moje wiązania zadziałały nawet po sortowaniu.

Answer 4

Można również użyć TableHtmlAttributes()

@(Html.Kendo().Grid<Object>() 
     .Name("dataGrid").TableHtmlAttributes(new { @class = "interactive" })