Как указать собственный класс CSS для kendo.Window()?

Я создал kendoWindow, и мне нужно создать собственный класс для его названия, поэтому я не использую общие классы, предоставляемые телериком.

Это мое окно:

$("#win").kendoWindow({
    visible: false,
    modal: true,
    title: true,
    open: function (e) { $("html, body").css("overflow", "hidden"); },
    close: function (e) { $("html, body").css("overflow", ""); },
    draggable: false,
    width: 950,
    height: 510,
    position: {
        top: 100,
        left: 500
    },
    resizable: false
}); 

Он генерирует следующий html:

введите здесь описание изображения

Я ищу способ изменить способ создания заголовка, используя мой собственный класс вместо существующего k-window-titlebar k-header

Как я могу сделать что-то подобное?


person gene    schedule 10.08.2018    source источник


Ответы (1)


Ниже показано, как вы можете настроить любой класс CSS в пользовательском интерфейсе Kendo:

//You need to first make sure the window is initialized - if you are not using Kendo wrappers 

$("#myWindow").kendoWindow({
  // put your settings here
});

// Now you can add a custom CSS class after window initialization

var winObject = $("#myWindow").data("kendoWindow");
winObject.wrapper.addClass("myCustomClass");

// Here you can add a custom CSS class in the open event handler

function onWindowOpen(e) {
    e.sender.wrapper.addClass("myCustomClass");
}

Дайте мне знать ваши результаты!

person JKimbrough    schedule 10.08.2018
comment
Я сделал следующее, и у меня это сработало: `$('#win_wnd_title').closest(div).addClass(customTitle)` - person gene; 11.08.2018
comment
Это тоже работает! Мой приведенный выше пример предназначен для определения более сложных (и множественных) пользовательских классов, так что держите его в заднем кармане. - person JKimbrough; 11.08.2018