Почему при submit из Marionette.ItemView срабатывает submit Form в родительском Marionette.LayoutView?

Question

[Андрюшков Константин]

Доброе время суток. Проблема из-за которой приходится на выходных сидеть на работе. Создаю представление Marionette.LayoutView в шаблоне которого есть форма с сабмитом.

define(function (require) {
    "use strict";

    var FormModel = require("А"),
        ConfirmCodeView = require("..."),
        Template = require("А"),
        
    require("user/behaviors/behaviors");

    var globalChannel = Backbone.Wreqr.radio.channel("global"),
        ...
        FormView;

    FormView = Marionette.LayoutView.extend({
        className: "confirm-personal-data-view",
        getTemplate: function () {
           return Template;
        },
        
        behaviors: {
            KeyboardScroll: {
                scrollEl: "form .content"
            },
            RequiredField: {},
            ProfileName: {},
            ProfileValidation: {}
        },

        ui: {
            form: "form"
        },

        initialize: function (options) {
            this.model = new FormModel({...});
        },

        onRoute: function (step, confirmMethod, requestId) {
            if (confirmMethod && requestId) {
                
                this.addRegions({
                    phoneConfirm: "#region-phone-confirm"
                });
       
                this.getRegion("phoneConfirm").show(new ConfirmCodeView({
                    ...
                }));
            }
        },

        modelEvents:  {
            ...
        },

        events: {
            ...
        },



        submitForm: function () {
            console.log("dataSubmit");
            ...
        }
   
    });

    return FormView;
});

Через регион отображаю дочернее представление ConfirmCodeView - Marionette.ItemView. В темплейте которого также есть форма с сабмитом

define(function (require) {
    "use strict";

    var i18n = require("i18n"),
        templateHelpers = require("app/template-helpers"),
        FormModel = require("Б"),
        template = require("Б");
    require("user/behaviors/behaviors");

    var modalChannel = Backbone.Wreqr.radio.channel("modal"),
        FormView;

    FormView = Marionette.ItemView.extend({
        className: "confirm-personal-phone-view",
        template: template,

        behaviors: {
            KeyboardScroll: {
                scrollEl: "form .content"
            },
            RequiredField: {},
            ProfileValidation: {}
        },

        ui: {
            form: "form[name=verify-code]"
        },

        initialize: function (options) {
           
            this.model = new FormModel({
                ...
            });
        },

        events: {
            ...
        },


        submitForm: function () {
            console.log("codeSubmit");
        }
    });

    return FormView;
});

Проблема заключается в том, что нажатие Input[type=submit] или this.ui.form.submit() из дочернего ConfirmCodeView - Marionette.ItemView ведет к срабатыванию submitForm ТОЛЬКО в родительском LayoutView.

Вариант напрямую вызова функции this.submitForm() при клике по кнопке не подходит, так как в bihaviors происходит отлавливание события SUBMIT из View и срабатывает проверка, фокус и скрол пустых полей, и если все норм выполнится submitForm().

Может кто подскажет с чем это может быть связано? Обработку событий и код behaviors не стал выкладывать, так как думаю, что проблема в нехватке каких-то теоретических знаний.

Comments

[aen]

У вас форма в форме?

Answer 1

[Андрюшков Константин]

Заблокировал всплытие события в дочерней форме.

submitForm: function(e) {
    if (e && e.preventDefault) {
        e.preventDefault();
    }
}