Backbone/jQuery móvil duplicado Vista

Question

Tengo algunos problemas con mi red troncal, necesidad de Aplicación Mobile JQuery. Cuando uso una vista de formulario 2 veces, el evento de envío del formulario se dispara dos veces. Cada nueva vista se agrega al cuerpo y se eliminará la vista anterior. Para eso uso este código en mi archivo App.js:

$(document).on("mobileinit", function () {
    $.mobile.linkBindingEnabled = false;
    $.mobile.hashListeningEnabled = false;

    $(document).on('pagehide', 'div[data-role="page"]', function (event, ui) {
        $(event.currentTarget).remove();
    });
})

Enrutador.js

define([
  'jquery',
  'backbone',
  'views/projects/ProjectsView',
  'views/projects/AddProjectView'
], function($, Backbone, ProjectsView, AddProjectView) {

  return Backbone.Router.extend({

    routes: {
      'addProject': 'addProject',
      'editProject/:projectId': 'editProject', 
      '*actions': 'showProjects' // Default
    },

    addProject: function() {
      new AddProjectView().render();
    },
    editProject: function(projectId) {
      require([
        "views/projects/EditProjectView", 
        "collections/ProjectsCollection", 
        "models/ProjectModel"
      ], function (EditProjectView, ProjectsCollection, ProjectModel) {
        var projectsCollection = new ProjectsCollection();
        projectsCollection.fetch();

        var project = projectsCollection.get(projectId);
        if (project) {
          var view = new EditProjectView({model: project, projectsCollection: projectsCollection});
          view.render();
        }
      });
    },


    showProjects: function() {
      new ProjectsView().navigate();      
    }

  });
});

He subido mi código a un directorio en mi sitio web: http://rickdoorakkers.nl/np2Si pasa por los siguientes pasos, verá el problema:

1. Agregar un proyecto
2. Agregue un segundo proyecto con un nombre diferente
3. Abra un proyecto haciendo clic en él y cambie los valores y guárdelo
4. Como puede ver, se inicia el evento de agregar un proyecto y hay un proyecto agregado en lugar de cambiar.
5. Este mismo problema también ocurre cuando intenta cambiar 2 proyectos entre sí. El primer proyecto se edita entonces.

¿Hay alguien que pueda decirme qué estoy haciendo mal?

¡Gracias!

Answer 1

Rido, su código es realmente difícil de leer para mí debido a la forma en que está mezclando algunas cosas y no sigue ninguna de las convenciones habituales para la columna vertebral.

Para su problema específico, tengo la sensación de que el problema es que está vinculando tanto la vista de edición como la nueva vista al cuerpo (el: el cuerpo), ambos responden al evento de envío, y nunca está limpiando claramente las vistas, así que yo pensar Que cada vez que agrega un proyecto y luego lo edite, la vista Agregar todavía está en la memoria, aún está vinculada al evento Enviar y aún responde el proyecto Call = nuevo proyecto con el nuevo nombre, en lugar de editar.

Es "fácil" solucionar de una manera sucia, agregando una llamada a la tope después de agregar, pero el verdadero problema es que está vinculando al cuerpo y mezclando el enrutador de la columna vertebral y el control manual de hash + otros patrones extraños, como buscar La colección cada 5 líneas (¡podría crear una al comienzo de la aplicación y usarla siempre! Aquí está el almacenamiento local para que no importa, pero si alguna vez se mueve a un almacenamiento remoto, lo lamentará ... obtenga () Restablezca la colección y haga una recarga completa!). ¿Puedo sugerirle que tal vez intente reescribir esto sin preocuparse por JQuery Mobile y simplemente tratar de que funcione con Backbone.Router + una sola colección + no vinculante al cuerpo, pero en su lugar, cree las vistas sobre la marcha y las agreguen al cuerpo / eliminación ¿Cuando acabes? Verá que los errores serán menos raros y más fáciles de rastrear.