javascript - backbone database search firing 4 times -


i have search functionality in backbone application queries database via api, reason fires 4 times (or atleast returns results 4 times).

here code,

collections

    app.collections.searchablecollection = backbone.collection.extend({},{        search: function(query, options) {         var search = $.deferred();         options = options || {};         var collection = new this([], options);         collection.url = _.result(collection, 'url');          var fetch = collection.fetch({             data: {                 q: query             }         });          fetch.done(_.bind(function(){             pops.events.trigger('search:done');             search.resolvewith(this, [collection]);         }, this));          fetch.fail(function(){             pops.events.trigger('search:fail');             search.reject();         });          return search.promise();     }  });  app.collections.projectsearch = app.collections.searchablecollection.extend({      url: pops.api_root + '/search/projects',  }); 

views

app.views.globalresults = backbone.view.extend({  el : '.ui-grid-list--results',  events: {     "click .js-open-project" : "removesearchview" },  initialize: function() {     this.addall(); },  render: function() {     var noresult = new pops.views.noglobalresult;      this.$el.before(noresult.render().el);      return this; },  addall: function() {     if(this.collection.length > 0) {         this.collection.each(this.addone, this);     } else {         this.render();     } },  addone: function(model) {     var resultitem = new pops.views.globalresult({         model:model     });      this.$el.append( resultitem.render().el ); },  removesearchview: function(e) {     settimeout(function(){         $('.ui-fullscreen').remove();     }, 1000);  } 

});

app.views.noglobalresult = backbone.view.extend({

classname: 'ui-message-block',  template: _.template("<h5>no results found</h5><p>sorry, not find projects matched serach criteria.</p>"),  initialize: function() {  },  render: function() {      this.$el.html( this.template() );      return this;  } 

});

app.views.globalresult = backbone.view.extend({

tagname : 'li',  classname: 'ui-grid-list__item',  template: _.template( $('#tpl-project-list-item').html() ),  initialize: function() {  },  render: function() {     var self = this;     var pjcreateddate  = moment( this.model.get('created_at'), 'yyyy-mm-dd hh:mm:ss' ) ;     var usercreateddate  = moment( pops.session.get('created_at'), 'yyyy-mm-dd hh:mm:ss' ) ;     var oneweekbeforeusercreateddate  = usercreateddate.subtract(8, 'day') ;     var givenewtag  = pjcreateddate.isafter(oneweekbeforeusercreateddate) && (typeof this.model.get('projectview') != 'undefined' && this.model.get('projectview').length === 0);      if(this.model.get('project_manager') instanceof backbone.collection === false){          this.model.set({'project_manager':new app.collections.users},{silent:true});      }if(this.model.get('collaborators') instanceof backbone.collection === false){          this.model.set({'collaborators':new app.collections.users},{silent:true});      }if(this.model.get('organisations') instanceof backbone.model === false){          var organisations  = this.model.get('organisations');         this.model.set({'organisations':new pops.models.organisation(organisations)},{silent:true});      }if(this.model.get('user') instanceof backbone.model === false){          var users  = this.model.get('user');         this.model.set({'user':new pops.models.user(users)},{silent:true});      }if(this.model.get('clients') instanceof backbone.model === false){          var clients  = this.model.get('clients');         this.model.set({'clients':new pops.models.client(clients)},{silent:true});      }       var projectmanagers = this.model.get('project_manager').tojson();     var collaborators =  this.model.get('collaborators').tojson();      var collabs = projectmanagers.concat(collaborators);      this.$el.html( this.template({         project: this.model.tojson(),         newtag: givenewtag,         collaborators: collabs     }));      this.model.get('project_manager').each(function(model, i){          if(i < 3) {             var newuser = new pops.views.userinitials({                 model:model             });             self.$('.ui-inline-list').append(newuser.render().el);         }     });      this.model.get('collaborators').each(function(model, i){          if(i < 3) {             var newuser = new pops.views.userinitials({                 model:model             });             self.$('.ui-inline-list').append(newuser.render().el);         }      });       var numpeople = this.model.get('collaborators').models.length + this.model.get('project_manager').models.length - 6;     console.log(numpeople);     if(numpeople > 0) {         self.$('.ui-inline-list').append('<li class="ui-inline-list__item"> + ' + numpeople + ' more</li>');     }      this.$el.attr('data-id', this.model.get('id'));     this.$el.attr('data-organisationid', this.model.get('organisation_id'));      if(this.model.get('archived_at') !== null) {         this.$el.addclass('ui-list-block__item--archived');         this.$el.addclass('ui-list-block__item--archived-' + parseint(moment(this.model.get('archived_at'), 'yyyy-mm-dd hh:mm:ss').format('yyyy'), 10));     }      if( this.model.get('visible') == false ) {         this.$el.hide();     }      if($('.ul-projects a[data-objectid="'+this.model.id+'"]').length < 1 ){          this.$el.addclass('ui-list-block__item--closed');     }      return this;  } 

the search triggered in view,

app.views.globalsearch = backbone.view.extend({  el : 'body',  template: _.template($('#tpl-global-search').html() ),  events: {     "click .js-close-fullscreen" : "removeview",     "click .js-make-filter" : "setsearchfilter",     "click .js-trigger-search" : "dosearch",     "keyup input[name=search]" : "processkey" },  initialize: function() {  },  render: function() {     this.$el.append(this.template());     return this; },  removeview: function(e) {     e.preventdefault();     this.$('.ui-fullscreen').remove(); },  setsearchfilter: function(e) {     e.preventdefault();     var element = $(e.currenttarget);     var selectedtext = element.text();      this.collectionname = element.data('collection');     this.isarchived = element.data('archived');      this.$('.dropdown-toggle').find('span:first').text(selectedtext); },  processkey: function(e) {     if(e.which === 13){         this.$('.js-trigger-search').trigger("click");     } },  dosearch: function(e) {     e.preventdefault();      var self = this;      this.$('.global-search-container').removeclass('error').find('p').remove()      if(this.collectionname == undefined) {         this.collectionname = "projectsearch";         this.isarchived = "all";     }      this.$('.js-trigger-search').find('i').removeclass('fa-search').addclass('fa-refresh spin')      this.$('.ui-grid-list--results').empty();     this.$('.ui-message-block').remove();      var projects = app.collections[this.collectionname];     var findprojects = projects.search({ string: this.$('[name=search]').val(), archived: this.isarchived });       findprojects.done(function(projects){          //console.log(projects)          var resultsview = new app.views.globalresults({             collection: projects         });          //resultsview.render();          self.$('.js-trigger-search').find('i').removeclass('fa-refresh spin').addclass('fa-search')      });  } 

});

now have never used $.deferred or promise's before using them wrong, dont think case.

the search gets initialised with,

var searchresults = new app.views.globalresults;


Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -