EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jd0000 on May 29, 2013, 08:11:28 PM



Title: Remove without destroying?
Post by: jd0000 on May 29, 2013, 08:11:28 PM
How do you remove the easyui component without deleting the original element?
If i have
Code:
<select id='meh'>
<option value=1>one</option>
<option value=2>two</option>
</select>
then i make a combobox $('#meh').combobox(); ... now how do i get back to my original element? i want to remove the combobox. if i do $('#meh').combobox('destroy'), it disappears completely, including my html markup.
im trying to do this because i multiple selects where the values of one affect what is others. i havent been able to remove or hide options in a way that lets me get them back later if filtering option is changes again.


Title: Re: Remove without destroying?
Post by: stworthy on May 30, 2013, 01:18:20 AM
No such feature is supported, you will have to extend it yourself. Here is the extended simple method to do this.
Code:
	$.extend($.fn.combo.methods, {
removeme:function(jq){
return jq.each(function(){
var state = $.data(this,'combo');
state.panel.panel('destroy');
state.combo.remove();
$(this).removeClass('combo-f combobox-f').show();
});
}
});

Calling 'removeme' method will remove the combobox warping and restore to its original state.
Code:
$('#meh').combobox('removeme');


Title: Re: Remove without destroying?
Post by: jd0000 on May 30, 2013, 03:25:32 AM
perfect, thank you!


Title: Re: Remove without destroying?
Post by: jd0000 on May 31, 2013, 06:06:16 AM
actually now im not sure thats working. it removes some of it, but the combo and combobox data is still attached to the object.


Title: Re: Remove without destroying?
Post by: stworthy on May 31, 2013, 08:10:25 AM
The 'removeme' method can be rewritten as:
Code:
	$.extend($.fn.combo.methods, {
removeme:function(jq){
return jq.each(function(){
var state = $.data(this,'combo');
if (state){
state.panel.panel('destroy');
state.combo.remove();
$(this).removeClass('combo-f').show();
$.removeData(this,'combo');
}
});
}
});
$.extend($.fn.combobox.methods, {
removeme:function(jq){
return jq.each(function(){
var state = $.data(this,'combobox');
if (state){
$.removeData(this,'combobox');
$(this).removeClass('combobox-f');
}
$(this).combo('removeme');
});
}
});