JQuery append problem with dynamic rendering in IE

I have met a problem when adding an option into a select box. This select box could be created/cloned dynamically using JQuery dynamic form. The problem only occurs on Internet Explorer, where some of select boxes will not get updated, which means that newly added option will not be visible for user. Actually, the problem is, the DOM has been updated correctly, only the UI-rendering process was failed.

Well, this looks very strange, but the solution is very simple. The idea is to force Mr.IE to re-render our select boxes, by hiding, and showing them:

// hide and show comboboxes, to solve an UI-render issue in IE, where DOM has been updated, but not UI
$container.find("select.addressBox").append("Hello Mr.IE").hide().show();

Continue reading “JQuery append problem with dynamic rendering in IE”