未捕获的错误：元素缓存中ID为x的DOM元素与DOM中的元素不同

Question

I've the following code in UI on the button Click event, which is returning an MS-Excel file. It works perfectly in first click event but, return the following error afterwards.

Any suggestions, how can I get rid of it?

ERROR: Uncaught Error: DOM element with id iframe in Element cache is not the same as element in the DOM. Make sure to clean up Element instances using destroy()

{
var body = Ext.getBody();
var frame = body.createChild({
tag:'iframe'
,cls:'x-hidden'
,id:'iframe'
,name:'iframe'
});

var form = body.createChild({
 tag:'form'
,cls:'x-hidden'
,id:'form'
,params: cloneExportObject
 ,method: 'post'
,action:link
,target:'iframe'
,enctype: 'application/x-www-form-urlencoded'
,encoding: 'application/x-www-form-urlencoded'
});

var hiddenItem1 = document.createElement('input');
Ext.fly(hiddenItem1).set({
type: 'hidden',
value: cloneExportObject.securityId,
name: 'securityId'
});
form.appendChild(hiddenItem1);

var hiddenItem2 = document.createElement('input');
Ext.fly(hiddenItem2).set({
type: 'hidden',
value: cloneExportObject.uniqueSearchId,
name: 'uniqueSearchId'
});
form.appendChild(hiddenItem2);

form.dom.submit();
}

Answer 1

if(Ext.Element.cache.hasOwnProperty(domId)){
            Ext.Element.cache[domId].destroy();
        }

        var domElement = Ext.get(domId);