Hej, więc używam lokalnego magazynu lokalnego i za każdym razem, gdy ktoś naciska przycisk wyszukiwania, chcę wyczyścić pamięć lokalną, aby móc po prostu dodać nowe dane do localStorage.

Ponadto, próbując dowiedzieć się, jak następnie przekierować użytkownika do nowego widoku po wywołaniu zwrotnym sukcesu dla zestawu localstorage, wiem, że istnieje view.remove (), ale nie jestem pewien, jak go użyć, ponieważ wywołanie zwrotne jest w widoku, a także, gdzie / jak renderować nowy widok ...

Załóżmy, że nowy widok to PageView ...

Oto kod bieżącego widoku wyszukiwania:

    define([
  'jquery',
  'underscore',
  'backbone',
  'models/search',
  'text!templates/search.html',

], function($, _, Backbone, SearchM, SearchT){ 

  var Search = Backbone.View.extend({
    model: SearchM,
    el: $("#Sirius"),

    events: {
      'submit #searchMusic': 'search'
    },
    search: function (e) {
      e.preventDefault();

      //create new instance of the model
      searchM = new SearchM();

      //post instance to the server with the following input fields
      searchM.save({
        channel: this.$('#channel').val(),
        week: this.$('#week').val(),
        year: this.$('#year').val(),
        filter: this.$('#filter').val()
      },{success: storeMusic});

      // on success store music on client-side localStorage
      function storeMusic (model, response, options) {
        console.log('store');
        //create new instance of the localStorage with the key name
        searchM.localStorage = new Backbone.LocalStorage("music");
        clearLocalStorage();
        saveToLocalStorage(response);
      };
      function clearLocalStorage () {
        console.log('clear');
          //removes the items of the localStorage
          this.localStorage.clear();

          //pops out the first key in the records
          searchM.localStorage.records.shift();

        };
        function saveToLocalStorage (response) {
          console.log('save');
          searchM.save({music: response}, {success: nextPage});
        };
         function nextPage () {
          console.log('entered next page');
          searchM.set('display', true);
        };


    },
    render: function () { 

    }
  });
    return Search;
});

Widok kontenera:

define([
  'jquery',
  'underscore',
  'backbone',
  'views/search',
  'text!templates/search.html'
], function($, _, Backbone, SearchV, SearchT){ 

  var Container = Backbone.View.extend({
    el: $("#Sirius"),
    render: function () { 
      var search = new SearchV();
      this.$el.html( SearchT );
      this.listenTo(searchM, 'change:display', console.log('changed MODEL'));
    }

      });
    return Container;
});

Oto model:

define([
  'underscore',
  'backbone'
], function(_, Backbone) {

  var Search = Backbone.Model.extend({
    url: '/music',
    defaults: {
        display: false
    }

  });
  return Search;
});

---------------- EDYTUJ Zmieszany z poniższym

To jest kontener i SearchM (model), SearchV (widok), SearchT (szablon) ...

var Container = Backbone.View.extend({
    el: $("#Sirius"),
    render: function () { 
      //Model CREATED
      searchM = new SearchM();

     //VIEW Created
      var search = new SearchV();
      this.$el.html( SearchT );
    }
      });
    return Container;
});

To jest widok wyszukiwania - więc wyjąłem model z tego miejsca, ale wywołanie tego lub tego.modelu w rzeczywistości nie działa, ponieważ searchM nie jest zdefiniowany, a model nie wydaje się być przekazany ... Dodałem tylko dwa metody, więc na razie zignoruj ​​resztę, jeśli uda mi się to sprawić, wszystko pójdzie w ich ślady

var Search = Backbone.View.extend({

    el: $("#Sirius"),

    events: {
      'submit #searchMusic': 'search'
    },
    search: function (e) {
      e.preventDefault();



      //post instance to the server with the following input fields
      searchM.save({
        channel: this.$('#channel').val(),
        week: this.$('#week').val(),
        year: this.$('#year').val(),
        filter: this.$('#filter').val()
      },{success: storeMusic()});

     function nextPage () {
          console.log('entered next page');
          searchM.set('display', true);
          this.listenTo(searchM, 'change:display', console.log('changed MODEL'));
          console.log(searchM.display);
        };