Изменение кнопок в Lightbox

Можно настраивать стандартные кнопки в Lightbox.

Начнем с коллекции, в которой управляются эти кнопки.
По умолчанию в Lightbox добавлены 3 кнопки ('Save', 'Cancel', 'Delete'), которые контролируются с помощью опций конфигурации buttons_left и buttons_right.

scheduler.config.buttons_left = ["dhx_save_btn", "dhx_cancel_btn"];
scheduler.config.buttons_right = ["dhx_delete_btn"];

Чтобы изменить стандартный набор кнопок, выполните следующие шаги:

  1. Добавьте новые элементы в массивы buttons_left или buttons_right следующим образом:
scheduler.config.buttons_left = ["dhx_save_btn","dhx_cancel_btn","locate_button"];
  1. Задайте подпись для кнопки следующим образом:
scheduler.locale.labels["locate_button"] = "Location";
  1. Настройте цвета кнопки, используя селектор {buttonName}_set. Например:
.dhx_save_btn_set{
    background-color:#4CAF50;
}

Related sample:  Custom Color for Buttons

  1. Добавьте иконку к кнопке (или примените другие стили), указав CSS-класс следующим образом:
.locate_button
{
    background-image:url('../../codebase/imgs/location.gif');
    background-position: -2px 0px;
    width:20px;
}
  1. Реализуйте обработчик события onLightboxButton для обработки кликов по кнопке, как показано ниже:
scheduler.attachEvent("onLightboxButton", function(button_id, node, e){
    if(button_id == "locate_button"){
        alert("Location!");
    }
});
Наверх