主干事件未通过取消委托清除
Backbone Event are not clearing by undelegate
我一直在研究主干错误，我正在尝试使用取消委托清理事件，也尝试取消绑定。实际上，当我从拖放中选择值时，它会创建从数据库中提取的 3 个网格。但是当我单击其他地方并再次单击下拉列表时，它会显示四个平面。
我猜这是由于鬼事件是问题，因此在下面尝试。但它似乎不起作用。也许我知道我在这里哪里出错了。
任何帮助都深表感谢。提前致谢
var towersetupimageview = Backbone.View.extend({
el : jQuery('#imageBlocksDiv'),
events : {
'keypress #no_of_towers' : 'totaltowers',
'change .floortypedropdownfortowerfloor': 'showflatsinfloorwise',
'click .saveflatdetails' : 'save_flat_details',
'click .updateflatdetails' : 'update_flat_details',
},
template: _.template(jQuery('#towersviewaccordian').html()),
cleanup: function() {
alert()
this.delegateEvents();
jQuery(this.el).empty();
},
initialize : function(){
_.bindAll(this, 'cleanup');
// _.bindAll(this);
this.cleanup();
this.unbind();
var that = this;
this.$el.html(this.template());
this.$el.append('<select style="float:left;padding:2px;" id="towersetupflats"></select>');
jQuery.ajax({
'cache': false,
'type':'GET',
'url': jQuery('#baseurl').val()+'index.php/api/authentication/content/'+jQuery('#towersetup').val()+'/sctowers',
success : function(response){
for(var i=0;i<response.length;i++){
jQuery('#towersetupflats').append('<option value="'+response[i]['objectId']+'">'+response[i]['tower_name']+'</option>');
}
that.showflatsfortower(jQuery('#towersetupflats').val());
}
});
jQuery('#towersetupflats').change(function(){
jQuery('#towerflatsetview').html('');
that.showflatsfortower(jQuery('#towersetupflats').val());
});
},
showflatsfortower : function(towerid){
var that = this;
jQuery('#imageBlocksDiv').append('<div style="float: left;margin-left: -9%;margin-top: 5%;width: 92%" id="towerflatsetview"></div>');
jQuery.ajax({
'cache': false,
'type':'GET',
'url': jQuery('#baseurl').val()+'index.php/api/authentication/randomdata/sctowers/objectId/'+towerid,
success : function(response){
console.log(response);
for(i=0;i<response[0]['no_of_floors'];i++){
jQuery('#towerflatsetview').append('<br><br><div class="towersetupstyle"><div style="float:left;margin-top:17px;"><span id="floornumber">'+i+'</span></div><div ><select id="floortypedropdownfortowerfloor'+i+'" class="floortypedropdownfortowerfloor"><option>Select Floor Type</option></select></div></div>');
}
that.getfloortypename();
}
});
},
getfloortypename : function(){
jQuery.ajax({
'cache': false,
'type':'GET',
'url': jQuery('#baseurl').val()+'index.php/api/authentication/content/'+jQuery('#towersetup').val()+'/scfloortype',
success : function(response1){
console.log(response1);
for(i=0;i<response1.length;i++){
jQuery('.floortypedropdownfortowerfloor').append('<option value="'+response1[i]['objectId']+'">'+response1[i]['name']+'</option>');
}
}
});
},
showflatsinfloorwise : function(ev){
var currentselect = jQuery(ev.currentTarget).attr('id');
var that = this;
var pushflatid = [];
var j = 1;
var floor_no = 'id'+jQuery(ev.currentTarget).parents().eq(1).find('#floornumber').text();
jQuery('#'+currentselect).parents().eq(1).find('.inventory_field').remove();
jQuery.ajax({
'cache': false,
'type':'GET',
'url': jQuery('#baseurl').val()+'index.php/api/authentication/flatdetails/sc_flat/tower_object_id/'+jQuery('#towersetupflats').val()+'/floorplan_type_object_id/'+jQuery(ev.currentTarget).val()+'/floor_no/'+floor_no,
success : function(responses){
// console.log(responses);
var k = 1;
if(responses['error'] == "could not be found"){
jQuery.ajax({
'type':'GET',
'url': jQuery('#baseurl').val()+'index.php/api/authentication/randomdata/scunitplan_on_floortype/floortype_object_id/'+jQuery('#'+currentselect).val(),
success : function(responses1){
for(var j = 0; j<responses1.length; j++){
jQuery.ajax({
'type':'GET',
'url':jQuery('#baseurl').val()+'index.php/api/authentication/randomdata/scunitplantype/objectId/'+responses1[j]['unitplantype_object_id']+'',
success : function(newdata){
jQuery('#'+currentselect).parents().eq(1).append('<div class="inventory_field"><div class="flats_in_floor"><select class="update_unitplantypename"><option value="'+newdata[0]['objectId']+'">'+newdata[0]['name']+'</option></select></div></div>');
}
});
}
that.getflatname(currentselect);
}
});
}
else{
for(var i = 0; i<responses.length; i++){
pushflatid.push(responses[i]['objectId']);
jQuery.ajax({
'type':'GET',
'url':jQuery('#baseurl').val()+'index.php/api/authentication/randomdata/scunitplantype/objectId/'+responses[i]['unitplan_object_id'],
success : function(newdata){
jQuery('#'+currentselect).parents().eq(1).append('<div class="inventory_field" id="inventory_field'+j+'"><div class="flats_in_floor"><select class="update_unitplantypename"><option value="'+newdata[0]['objectId']+'">'+newdata[0]['name']+'</option></select></div></div>');
j++;
}
});
jQuery.ajax({
'cache': false,
'type':'GET',
'url': jQuery('#baseurl').val()+'index.php/api/authentication/randomdata/sc_flat_common_fields_details/flat_object_id/'+responses[i]['objectId'],
success : function(newres){
for(var j=0; j<newres.length; j++){
jQuery('#'+currentselect).parents().eq(1).find('#inventory_field'+k).append('<div style="float:left;width:100%"><span style="width: 60px;float: left;margin: 5px;">'+newres[j]['common_field_name']+'</span><span style="margin:5px;float:left;"><input type="text" value="'+newres[j]['common_field_value']+'" id="'+newres[j]['objectId']+'" size="10" class="flat_common_field_value"><span></div>');
//jQuery('#'+currentselect).parents().eq(1).find('#inventory_field'+k+ ' .flat_common_field_value[data-objectid="'+inputid+'"]').attr('id',invfield[0]['objectId']);
if(j == "4"){ k++; }
}
var kval = (k-1);
jQuery('#'+currentselect).parents().eq(1).find('#inventory_field'+kval).append('<div class="updateflatdetails">Update</div><div class="flat_common_loader"><img style="float:right" src="http://www.dwellar.com/portal/assets/icon/dots.gif"></div><div class="update_flat_message">Update Flat Details..</div>');
}
});
}
//that.getflatdetails(currentselect,pushflatid);
}
}
});
},
getflatdetails : function(currentselect,flatid){
var that = this;
jQuery.ajax({
'cache': false,
'type':'GET',
'url':jQuery('#baseurl').val()+'index.php/api/authentication/content/'+jQuery('#towersetup').val()+'/sc_inventory_fieldconfigured',
success : function(invfield){
for(var k=0; k<invfield.length; k++){
jQuery('#'+currentselect).parents().eq(1).find('.inventory_field').append('<div style="float:left;width:100%;"><span style="width: 60px;float: left;margin: 5px;">'+invfield[k]['field_name']+'</span><span style="margin:5px;float:left;"><input type="text" size="10" id="'+invfield[k]['field_name']+'" data-objectid="'+invfield[k]['objectId']+'" class="flat_common_field_value" onload="'+that.myFunction(flatid,invfield[k]['objectId'],currentselect)+'"></span></div>');
}
jQuery('#'+currentselect).parents().eq(1).find('.inventory_field').append('<div class="updateflatdetails">Update</div><div class="flat_common_loader"><img style="float:right" src="http://www.dwellar.com/portal/assets/icon/dots.gif"></div><div class="update_flat_message">Update Flat Details..</div>');
}
});
},
myFunction : function(flatid,inputid,currentselect){
var j = 1;
for(var n = 0; n<flatid.length; n++){
jQuery.ajax({
'cache': false,
'type':'GET',
'url':jQuery('#baseurl').val()+'index.php/api/authentication/newrandomdata/sc_flat_common_fields_details/flat_object_id/'+flatid[n]+'/common_field_object_id/'+inputid,
success : function(invfield){
jQuery('#'+currentselect).parents().eq(1).find('#inventory_field'+j+ ' .flat_common_field_value[data-objectid="'+inputid+'"]').val(invfield[0]['common_field_value']);
jQuery('#'+currentselect).parents().eq(1).find('#inventory_field'+j+ ' .flat_common_field_value[data-objectid="'+inputid+'"]').attr('id',invfield[0]['objectId']);
j++;
}
});
}
},
getflatname : function(currentselect){
jQuery.ajax({
'type':'GET',
'url':jQuery('#baseurl').val()+'index.php/api/authentication/content/'+jQuery('#towersetup').val()+'/sc_inventory_fieldconfigured',
success : function(invfield){
//console.log(invfield.length);
for(var k=0; k<invfield.length; k++){
jQuery('#'+currentselect).parents().eq(1).find('.inventory_field').append('<div style="float:left;width:100%;"><span style="width: 60px;float: left;margin: 5px;">'+invfield[k]['field_name']+'</span><span style="margin:5px;float:left;"><input type="text" size="10" id="'+invfield[k]['field_name']+'" data-objectid="'+invfield[k]['objectId']+'" class="flat_common_field_value"></span></div>');
}
jQuery('#'+currentselect).parents().eq(1).find('.inventory_field').append('<div class="saveflatdetails">Save</div><div class="flat_common_loader"><img style="float:right" src="http://www.dwellar.com/portal/assets/icon/dots.gif"></div><div class="save_flat_message">Flat Details Saved..</div>');
}
});
},
save_flat_details : function(ev){
var currentbuton = ev.currentTarget;
jQuery(ev.currentTarget).parents().eq(0).find('.flat_common_loader').show();
var fl = jQuery(ev.currentTarget).parents().eq(0).find('.flat_common_field_value').length;
var ij = 0;
var fieldinputData = {
'tower_object_id' : jQuery('#towersetupflats').val(),
'floor_no' : 'id'+jQuery(ev.currentTarget).parents().eq(1).find('#floornumber').text(),
'floorplan_type_object_id' : jQuery(ev.currentTarget).parents().eq(1).find('.floortypedropdownfortowerfloor').val(),
'unitplan_object_id' : jQuery(ev.currentTarget).parents().eq(0).find('.update_unitplantypename').val(),
'projectId' : jQuery('#towersetup').val(),
};
jQuery.ajax({
'type':'POST',
'url': jQuery('#baseurl').val()+'index.php/api/example/content/sc_flat',
'data' : fieldinputData,
success : function(field){
console.log(field);
jQuery(ev.currentTarget).parents().eq(0).find('.flat_common_field_value').each(function(){
var fieldinputData = {
'flat_object_id' : field.objectId,
'projectId' : jQuery('#towersetup').val(),
'common_field_object_id' : jQuery(this).attr('data-objectid'),
'common_field_value' : jQuery(this).val(),
'common_field_name' : jQuery(this).attr('id')
};
jQuery.ajax({
'type':'POST',
'url': jQuery('#baseurl').val()+'index.php/api/example/content/sc_flat_common_fields_details',
'data' : fieldinputData,
success : function(response){
console.log(response)
jQuery(currentbuton).parents().eq(0).find('.flat_common_loader').hide();
if(fl/ij == "1"){
jQuery(currentbuton).parents().eq(0).find('.save_flat_message').show();
jQuery(currentbuton).parents().eq(0).find('.save_flat_message').fadeOut(3000);
}
}
});
ij++;
});
}
});
},
update_flat_details : function(ev){
jQuery(ev.currentTarget).parents().eq(0).find('.flat_common_loader').show();
var currentbuton = ev.currentTarget;
var ij = 0;
var fl = jQuery(ev.currentTarget).parents().eq(0).find('.flat_common_field_value').length;
jQuery(ev.currentTarget).parents().eq(0).find('.flat_common_field_value').each(function(){
var fieldinputData = {
'common_field_value' : jQuery(this).val()
};
fieldinputData.id = (jQuery(this).attr('id') != null) ? jQuery(this).attr('id'):"";
jQuery.ajax({
'type':'POST',
'url': jQuery('#baseurl').val()+'index.php/api/example/content/sc_flat_common_fields_details',
'data' : fieldinputData,
success : function(response){
console.log(response)
jQuery(currentbuton).parents().eq(0).find('.flat_common_loader').hide();
if(fl/ij == "1"){
jQuery(currentbuton).parents().eq(0).find('.update_flat_message').show();
jQuery(currentbuton).parents().eq(0).find('.update_flat_message').fadeOut(3000);
}
}
});
ij++;
});
}
});
我认为
问题是您在此处手动绑定更改处理程序：
jQuery('#towersetupflats').change(function(){ ... });
undelegateEvents仅通过delegateEvents删除绑定到视图el的事件(即视图events中的事件(。
您应该在events中绑定所有事件：
events : {
//...
'change #towersetupflats': 'some_function'
},
some_function: function() {
this.$('#towerflatsetview').html('');
this.showflatsfortower(this.$('#towersetupflats').val());
}
相关文章：
- 如何在angularJS中编辑时，如果DB中的值为true，则设置复选框，如果值为false，则取消选中复选框
- jquery点击函数select&取消选择
- document.open/document.write没有正确地清除chrome中的文档——这是chrome的错误吗
- 单击jquery清除输入值
- 使用Jquery选择或取消选择ListView中的所有复选框
- 使用jquery选中/取消选中单个复选框
- 如何在Microsoft VirtualEarth 6.3中使用纯javascript清除整个形状层
- 使用javascript取消隐藏和隐藏表单中的某些元素
- 主干事件未通过取消委托清除
- 离子模态:在单击/取消时清除所有字段
- 取消选中复选框时隐藏和清除文本框
- 用于清除/取消选择单选按钮列表中的项目的 Javascript
- 如何在确认消息框中单击取消按钮后清除文本框
- 如何使用复选框取消选中来清除单选按钮
- 动态设置、取消设置和清除全局变量
- 使用Javascript清除基于取消选中的选择
- Javascript，在确认窗口中按OK后清除表单.但如果取消确认，则保留表单数据
- 单击“取消”按钮后清除选中的复选框
- 如何在jquery中取消选中复选框时清除文本框值
- 如何使用MVC razor在JavascriptJquery中取消/禁用或清除文本框
