Диалог Условия + Условия в backbone.js

Question

Я хотел бы открыть диалоговое окно T + C, когда вы нажимаете кнопку отправки формы.Я использую backbone.js.Я не могу понять, должен ли я втиснуть диалог в FormView, или вызвать DialogView из FormView, или связать его с событием или чем-то еще.

В идеале мой метод FormView Save () должен был бы инициализировать его с обратным вызовом Accept и Decline.Моя предыдущая реализация без Backbone передала все управление самому диалогу, что было немного не элегантно.Кто-нибудь может предложить что-нибудь?

edit: Спасибо Дерику, вот где я.Однако обратите внимание, что диалог JqueryUI добавляется в конце «body» и, таким образом, теряет свой контекст (он больше не переносится в div, из которого он получен), поэтому привязка событий не работает.

save: ->
    that = @
    dlg = new TermsConditionsView({el: '#tcDialog'})
    dlg.bind 'accepted', @tncAccepted, @
    dlg.bind 'declined', @tncDeclined, @
    $(dlg.render().el).dialog
        draggable: false
        resizable: false
        width: 500
        height: 600
        modal: true
        dialogClass: 'termsConditions'
        buttons: [
            {
                id: 'acceptButton'
                text: 'Accept'
                click: -> that.tncAccepted()
            }
            {
                id: 'declineButton'
                text: 'Decline'
                click: -> that.tncDeclined()
            }
        ]

Answer 1

Я бы заставил FormView вызвать отдельный DialogView и прослушать событие «принято» и «отклонено», которое DialogView сработает в зависимости от действий пользователя.

FormView = Backbone.View.extend({
  events: {
    "click #save": "save"
  },

  save: function(){
    var dlg = new TnCView();
    dlg.bind("accepted", this.tncAccepted, this);
    dlg.bind("declined", this.tncDeclined, this);
    $(dlg.render().el).dialog();
  },

  tncAccepted: function(){
    // do whatever you need, when the user accepts the terms n conditions
  },

  tncDeclined: function(){
    // do whatever you need, when the user declines the terms n conditions
  }
});

TnCView = Backbone.View.extend({
  events: {
    "click #accept": "accept",
    "click #decline": "decline"
  },

  accept: function(){
    // close the dialog
    this.trigger("accepted");
  },

  decline: function(){
    // close the dialog
    this.trigger("declined");
  }
});

Обратите внимание, что япоместите FormView в управление превращением Условий и Условий в диалог.я предпочитаю, чтобы родительская форма контролировала, когда / где 'el' дочерней формы помещается в DOM / отображается на экране.это, как правило, делает код чище и более гибким в долгосрочной перспективе.