Backbone/jQuery Mobile Duplicate View

Question

У меня есть некоторые проблемы с мобильным приложением TearyJS & JQuery. Когда я использую форму, просмотр формы в 2 раза, событие отправки формы запускается дважды. Каждый новый вид добавляется в тело, и предыдущий вид будет удален. Для этого я использую этот код в моем файле 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();
    });
})

Router.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();      
    }

  });
});

Я загрузил свой код в каталог на своем веб -сайте: http://rickdoorakkers.nl/np2Если вы пройдете через следующие шаги, вы увидите проблему:

1. Добавить проект
2. Добавить второй проект с другим именем
3. Откройте проект, нажав на него, измените значения и сохраните его
4. Как вы можете видеть, что событие добавления проекта запускается, и вместо изменения добавлен проект.
5. Эта же проблема также возникает, когда вы пытаетесь изменить 2 проекта за друг другу. Первый проект отредактирован тогда.

Есть ли кто -то, кто может сказать мне, что я делаю не так?

Спасибо!

Answer 1

Ридо, ваш код действительно трудно прочитать для меня из -за того, как он смешивает несколько вещей и не следовал ни одного из обычных конвенций для основы.

Что касается вашей конкретной проблемы, у меня есть чувство, что проблема в том, что вы связываете как редактирование, так и новый взгляд на Body (EL: Body), оба отвечаете на представление события, и вы никогда не чистите представления, поэтому я считать Это всякий раз, когда вы добавляете проект, а затем редактируете его, представление Add по -прежнему находится в памяти, все еще связано с событием отправки и все еще отвечает на Call = новый проект с новым именем, вместо редактирования.

«Легко» исправить грязным образом, добавив призыв к остановке после добавления, но реальная проблема заключается в том, что вы связываете тело и смешивая объединения маршрутизатора магистрали и ручного управления хэшем + другие странные узоры, такие как выборочные Коллекция каждые 5 строк (вы можете просто создать одну в начале приложения и всегда использовать ее! Здесь это локальная организация, так что это не имеет значения, но если вы когда -нибудь перейдете на удаленное хранилище, вы сожалеете о нем ... () Сбросьте коллекцию и сделайте полную перезагрузку!). Могу я предложить вам, возможно, попытаться переписать это, не заботясь о jQuery Mobile, и просто попытаться заставить его работать с Backbone.Router + One Collection + не обязательна с корпусом, а вместо этого создайте представления на лету и добавьте их к телу / удалению когда вы сделали? Вы увидите, что ошибки будут менее странными и легче отслеживать.