javascript - How to clone div with html controls without their content using jquery & refresh dropdown for IE? -
i using jquery .clone() function clone div having 6 controls (dropdowns, textboxes etc) .i have functionality there 2 dropdowns ddl a & ddl b . changing ddl item populates content in ddl b. function works fine in chrome , firefox , ipad doesn't work in ie .
the scenario clone div of 6 controls add new row data entry, & when select item ddl , shows corresponding item in ddlb. when again select other item ddl a, options of ddl b don't refreshed . strange in firebug of ie ddl b shows proper options, view doesn't.
is ie doesn't refreshes dropdown before repopulation or doesn't understands jquery .clone() function ? can me proper solution ?
the problem ie not clears dropdown when script
$("#ddlb").empty();
the rest of browsers work fine snippet.
so need use
$("#ddlb")[0].options.length = 1;
these clears old dropdown state & data in ie. successful create functionality clone divs different html controls . following snippet
$(function () { $('.addrow').click(function () { var clicknumrow = $(this).data('clicknumrow'); if (!clicknumrow) clicknumrow = 1; $("#original").clone(true).insertbefore('.addnewrow').attr('id', 'original_' + clicknumrow); $("#original_" + clicknumrow + " select#materialid")[0].options.length = 1; $(this).data('clicknumrow', ++clicknumrow); }); });
i refresh dropdown on selection change of dropdown item
$(function () { $('select#categoryid').change(function () { var url = "/material/fillmatbycatid"; var ddlsource = this; var prt = $(this).parent().parent().parent().attr('id'); var ddltarget = '#' + prt + ' select#materialid'; if ($(this).val() != '') { $.getjson(url, { catid: $(this).val() }, function (data) { $(ddltarget)[0].options.length = 1; $(ddltarget).empty(); $.each(data, function (index, optiondata) { $(ddltarget).append("<option value='" + optiondata.value + "'>" + optiondata.text + "</option>"); }); }); } }); });
Comments
Post a Comment