Проверьте пожалуйста скрипт

Ребята, посмотрите, пожалуйста код. Он рабочий, просто хочу получить feedback. Может есть явные ошибки. Спасибо.

    modules.define('pgc-create', ['i-bem__dom'], function(provide, BEMDOM) {
    provide(BEMDOM.decl(this.name, {
    onSetMod: {

        'js': {
            'inited': function() {
                this.bindTo(this.elem('prev'), 'click', this._onClick); // подписка на DOM-событие "click" по кнопке "Назад"
            }
        },

        step: function(modName, modVal) {
            this
                .delMod(this.elem('step'), 'active')
                .setMod(this.elem('step').eq(modVal - 1), 'active')
                .delMod(this.elem('number'), 'active')
                .setMod(this.elem('number').eq(modVal - 1), 'active')
                .delMod(this.elem('text'), 'active')
                .setMod(this.elem('text').eq(modVal - 1), 'active')
                .delMod(this.elem('arrowgrey'), 'active')
                .setMod(this.elem('arrowgrey').eq(modVal - 1), 'active')
                .delMod(this.elem('arrowwhite'), 'active')
                .setMod(this.elem('arrowwhite').eq(modVal - 1), 'active')
                .delMod(this.elem('fields'), 'visible')
                .setMod(this.elem('fields').eq(modVal -1), 'visible');

            modVal === '4' &&  this
            .delMod(this.elem('next'), 'visible') // прячем кнопку "Продолжить"
            .delMod(this.elem('submit'), 'hidden'); // показываем кнопку "Отправить"
            modVal > '1' && this.delMod(this.elem('prev'), 'hidden'); // на втором шаге показываем кнопку "Назад"
            modVal === '1' && this.setMod(this.elem('prev'), 'hidden'); // на первом шаге прячем кнопку "Назад"

        }
    },
    _onSubmit: function(e) { // Листаем вперед
        e.preventDefault();
        // TODO: валидация примерно здесь
        this.setMod('step', +this.getMod('step') + 1);
    },
    _onClick: function(e) {  // Листаем назад
        e.preventDefault();
        this.setMod('step', +this.getMod('step') - 1); 
    }
    }, {
    live: function() {

        this.liveBindTo('submit', this.prototype._onSubmit);

    }
    }));
    });

8 years ago

tadatuta

Это ок, что клик по «Назад» не будет работать, пока не будет отправлена форма?
Точно ли нужен e.preventDefault(); в обработчике на клик по «Назад»?

8 years ago

godfreyd

Это ок, что клик по «Назад» не будет работать, пока не будет отправлена форма?

Работает, так как на втором шаге только появляется кнопка "Назад", а чтобы на него перейти, мы подписываемся на событие 'submit'. Так делать неправильно?

8 years ago

godfreyd

Переделал так:

modules.define('pgc-create', ['i-bem__dom'], function(provide, BEMDOM) {
provide(BEMDOM.decl(this.name, {
onSetMod: {
    step: function(modName, modVal) {
        this
            .delMod(this.elem('step'), 'active')
            .setMod(this.elem('step').eq(modVal - 1), 'active')
            .delMod(this.elem('number'), 'active')
            .setMod(this.elem('number').eq(modVal - 1), 'active')
            .delMod(this.elem('text'), 'active')
            .setMod(this.elem('text').eq(modVal - 1), 'active')
            .delMod(this.elem('arrowgrey'), 'active')
            .setMod(this.elem('arrowgrey').eq(modVal - 1), 'active')
            .delMod(this.elem('arrowwhite'), 'active')
            .setMod(this.elem('arrowwhite').eq(modVal - 1), 'active')
            .delMod(this.elem('fields'), 'visible')
            .setMod(this.elem('fields').eq(modVal -1), 'visible');

        modVal === '4' &&  this
        .delMod(this.elem('next'), 'visible') // прячем кнопку "Продолжить"
        .delMod(this.elem('submit'), 'hidden'); // показываем кнопку "Отправить"
        modVal > '1' && this.delMod(this.elem('prev'), 'hidden'); // на втором шаге показываем кнопку "Назад"
        modVal === '1' && this.setMod(this.elem('prev'), 'hidden'); // на первом шаге прячем кнопку "Назад"

    }
},
_onNextClick: function(e) { // Листаем вперед
    e.preventDefault();
    // TODO: валидация примерно здесь
    this.setMod('step', +this.getMod('step') + 1);
},
_onPrevClick: function(e) {  // Листаем назад
    e.preventDefault();
    this.setMod('step', +this.getMod('step') - 1); 
}
}, {
   live: function() {

     this.liveBindTo('next', 'click', function(e) {
        this._onNextClick(e);
    });
    this.liveBindTo('prev', 'click', function(e) {
        this._onPrevClick(e);
    });

}
}));

});

8 years ago

tadatuta

Вопрос про e.preventDefault(); в обработчиках кликов остается открытым. Оно там точно нужно?

Чтобы оставлять комментарии, необходимо авторизоваться.