1

Сделал виджет со своим Asset в котором подключается new-widget.js

class newWidget {
    static init(){
        $( "#grid_column_sort ul" ).sortable({
            connectWith: ".connectedSortable",
            placeholder: "ui-state-highlight",
            cancel: ".ui-state-disabled",
        }).disableSelection();
    };
}

У меня есть AppAsset в котором подключается user.js

window.onload = function() {
    newWidget.init();
    $(document)
        .on('pjax:complete', function() {
            newWidget.init();
        })
};

Виджет newWidget подключен не на всех страницах, как лучше проверить его наличие? Или как лучше организовать их взаимодействие?

8
  • Так а зачем его как-то откуда-то инициализировать? Пусть js виджета в себе и сделает инициализацию 1 фев в 14:09
  • + еще pjax обновляет html код (виджета в том числе) и нужно опять вызывать new.Widget.init() для назначения обработчиков. 1 фев в 15:11
  • + --- что за за плюс? к чему он? 1 фев в 15:24
  • "pjax обновляет html код (виджета в том числе) и нужно опять вызывать new.Widget.init()" --- значит ты написал кривой код. Делегирование вполне решает вопросы слушателей. 1 фев в 15:25
  • Да, точно, это можно решить с помощью делегирования. Но еще в init() используется jQuery UI Sortable (обновил верхнее сообщение). Если с pjax его html обновить, то его javascript перестает работать. Как можно избежать переинициализации sortable? 2 фев в 1:50

1 ответ 1

0

Разорвал связи с помощью делегирования. new-widget.js:

class gcs{
    static enableSortable() {
        $( "#grid_column_sort ul").sortable({
            connectWith: ".connectedSortable",
            placeholder: "ui-state-highlight",
            cancel: ".ui-state-disabled",
        }).disableSelection();
    }

    static init() {
        $(document)
            .on('mouseover', function(event) {
                if (event.target.id === 'grid_column_sort') {
                    let $grid = $("#grid_column_sort");
                    if ($grid.data('init') !== true) {
                        gcs.enableSortable();
                        $grid.data({init: true});
                    }
                }
            })
            .on('click', function(event) {
                if (event.target.id === 'hide_grid_column_sort') {
                    let elem = document.getElementById('grid_column_sort');
                    elem.hidden = !elem.hidden;
                }
            })
    }
}

$(window).on('load', function() {
    gcs.init();
})

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.