Databases
StackOverflow2013
Postsdbo
POClear localStorage and change the view Backbone
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POClear localStorage and change the view Backbone
    primarykey
    data
    text
    <p>Hey so I am using backbone localstorage and every time someone hits the search button I want to clear the localstorage so I can just add the new data to the localStorage. </p> <p>Also, trying to figure out how to then redirect the user to a new view after the success callback in for the localstorage being set, I know there is view.remove() but I am not sure how to use that being that the callback is within the view and also, where/how to render the new view...</p> <p>Let's say the new view is PageView...</p> <p>Here is the code for the current search view:</p> <pre><code> 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; }); </code></pre> <p>Container view:</p> <pre><code>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; }); </code></pre> <p>Here is the model:</p> <pre><code>define([ 'underscore', 'backbone' ], function(_, Backbone) { var Search = Backbone.Model.extend({ url: '/music', defaults: { display: false } }); return Search; }); </code></pre> <p>----------------EDIT Confused with below</p> <p>This is the container and SearchM(model), SearchV(view), SearchT(template)... </p> <pre><code>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; }); </code></pre> <p>This is the search View - so I took out the model from here, but calling this or this.model actually does not work, as searchM is not defined and the model does not seemed to be passed in... I only added the two methods so ignore the rest for now, if I can make these work then everything can follow suit</p> <pre><code>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); }; </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USLion789
    1. USLion789
    plurals
    1. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    3. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POClear localStorage and change the view Backbone
      1. USLion789
      1. VTFavorite
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload