Backbone.js的Ajax在Chrome和Firefox中调用不同的行为

我在Firefox中遇到了一个奇怪的问题。我们正在加载一个页面，同时调用Routers.initializeRouters（）;发送ajax请求来获取数据，loadFormSuccessHandler函数将响应填充到视图中。Backbone.js的Ajax在Chrome和Firefox中调用不同的行为

在Chrome的情况下，Ajax请求会等待视图被初始化，然后数据会通过ajax响应填充到视图中。

在Firefox的情况下，Ajax请求获取数据并开始填充视图，并失败，因为一些视图仍未初始化。

如何在填充数据之前通知ajax请求等待视图初始化。

任何指针都会有帮助。

Main.js

var Main = { 

    treeView : null, 
    formView : null, 
    mainTabBarView : null, 
    currentFieldView : null, 
    designModeViewPointer : null, 
    carousel : null, 
    advancedControlsView : null, 

    renderUI : function() { 
     Templates.loadTemplateList(); 
     Utility.initializeFieldHandlerMap(); 
     Views.showBody(); 
     Routers.initializeRouters(); 
     var form = new Models.Form(); 
     this.formView = Views.showForm('formDetailsDiv', form); 
     this.treeView = new Views.TreeView({ 
      el : $('#controlsTreeDiv'), 
      model : null 
     }); 

     this.treeView.getTree().attachEvent("onDblClick", 
       ControlBizLogic.formTreeNodeClickHandler); 

     Main.mainTabBarView = new Views.TabBarView({ 
      el : $('#csdOperationsContainer'), 
      model : null 
     }); 
     Views.showControlTab('control'); 
     this.carousel = $('#controlTypesSlider'); 
     this.carousel.tinycarousel(); 
     Main.advancedControlsView = new Views.AdvancedPropertiesTabView({ 
      el : $('#advancedControlProperties'), 
      model : null 
     }); 
     // init design mode 
     Main.designModeViewPointer = new Views.DesignMode({ 
      el : $("#design") 
     }); 
     Routers.designModeOnBeforeDragEvent(); 
     Routers.designModeOnDragEvent(); 

    } 
} 

Main.renderUI();

与Ajax调用响应

loadForm : function(_id, edit) { 
        $("#formWaitingImage").show(); 
        if (Main.formView == null) { 
         Main.formView = Views.showForm('formTab', 
           new Models.Form({ 
            "id" : _id 
           })); 

        } 
        Main.formView.getFormModel().set({ 
         id : _id 
        }); 
        GlobalMemory.editForm = (edit == "true"); 
        Main.formView.getFormModel().fetch({ 
         url : 'csdApi/form/' + _id + "/" + edit, 
         success : this.loadFormSuccessHandler 
        }); 
        // save as 
       }, 

loadFormSuccessHandler : function(model, response) { 
        var formId = model.get('id'); 
        if (formId != undefined && formId != null) { 
         GlobalMemory.editForm = true; 
        } 
        Routers.formEventsRouterPointer.updateUI(model); 
        Routers.formEventsRouterPointer.loadFormulae(Main.formView 
          .getFormModel(), "", ""); 

        AdvancedControlPropertiesBizLogic 
          .loadSkipRules(Main.formView.getFormModel()); 
        Main.formView.getFormModel().set({ 
         skipRules : model.get('skipRules'), 
         id : model.get('id') 
        }); 
        Main.advancedControlsView.setTableCss('formulaTable'); 
        // Main.mainTabBarView.loadFormSummary(); 
        Main.mainTabBarView.getFormSummaryView().displayFormInfo(
          model.getFormInformation()); 

        $("#formWaitingImage").hide(); 
        // save form 

        if (!GlobalMemory.editForm) { 

         $('#saveForm').prop("value", " Save As ") 
        } 
       },

来源

2016-07-26 Maverick

这个问题涉及到具体的Firefox版本，它是固定在未来版本的Firefox的方法。

来源

2017-02-14 17:13:41 Maverick

Backbone.js的Ajax在Chrome和Firefox中调用不同的行为

回答

相关问题