question for Ext 1.1 DomHelper.insertHtml?

[hanyilong]

I put a Ext.form.Form in a Ext.BasicDialog, which include a Ext.form.DateField. When I click the DateField's chose date button,there raise a error in DomHelper.insertHtml. And said el.insertAdjacentHTML is undefined. then I debug it to change the DomHelper.insertHtml method, add some code in the method head, which is:
<code>
insertHtml : function(where, el, html){
if(!el.insertAdjacentHTML){
el = el.ownerDocument.body;
}
....
</code>
Then it's work ok, so I don't know if it's a bug.
My Explorer is IE6.0.

[Animal]

Show us where you create the DateField, and how you add it to the form.

[hanyilong]

There is a button,click it then show a dialog with a form,In the form include a DateField.



var Message = function() {
var pagesize = 10;
return {
init : function() {
var myData = [['十六大开幕', '新闻', '湖景涛同志发表重要讲话', '黄健翔', '2007-9-9']];
var mp = new Ext.data.SubmemoryProxy(myData);
var ds = new Ext.data.SubStore( {
proxy : mp,
reader : new Ext.data.ArrayReader( {}, [ {
name : 'title'
}, {
name : 'folder'
}, {
name : 'content'
}, {
name : 'maker'
}, {
name : 'mkdate'
}])
});
var colModel = new Ext.grid.ColumnModel([ {
header : "标题",
width : 75,
sortable : true,
dataIndex : 'title'
}, {
header : "分类",
width : 100,
sortable : true,
dataIndex : 'folder'
}, {
header : "内容",
width : 100,
dataIndex : 'content'
}, {
header : "作者",
width : 100,
dataIndex : 'maker'
}, {
header : "发表时间",
width : 100,
dataIndex : 'mkdate'
}]);

// create the Grid
this.grid = new Ext.grid.Grid('main-ct', {
ds : ds,
cm : colModel
});

var layout = Ext.BorderLayout.create( {
center : {
margins : {
left : 3,
top : 3,
right : 3,
bottom : 3
},
panels : [new Ext.GridPanel(this.grid)]
}
}, 'grid-panel');

this.grid.render();
var gridHead = this.grid.getView().getHeaderPanel(true);
var tb = new Ext.Toolbar(gridHead);
tb.add( {
id : 'add',
text : '新增',
handler : this.showDetail.createDelegate(this, [true])
}, '-', {
id : 'edit',
text : '编辑',
handler : this.showDetail.createDelegate(this, [false])
}, '-', {
id : 'delete',
text : '删除',
handler : this.deleteItem.createDelegate(this)
});

var gridFoot = this.grid.getView().getFooterPanel(true);
var paging = new Ext.PagingToolbar(gridFoot, ds, {
pageSize : pagesize,
displayInfo : true,
displayMsg : '显示结果 {0} - {1} 共 {2}',
emptyMsg : "没有找到任何记录"
});
ds.load( {
params : {
start : 0,
limit : pagesize
}
});
this.grid.getSelectionModel().selectFirstRow();
this.grid.addListener('celldblclick', function(grid1, rowIndex,
columnIndex, event) {
this.showDetail(false);
}, this);
},
showDetail : function(isnew) {
if (!this.detaildlg) {
this.detaildlg = new Ext.LayoutDialog('detail', {
title : '详细信息',
modal : true,
width : 650,
height : 500,
minWidth : 650,
minHeight : 500,
center : {
autoScroll : true
}
});
var layout1 = this.detaildlg.getLayout();
layout1.beginUpdate();
var pan1 = new Ext.ContentPanel('detailpan');
layout1.add('center', pan1);
this.editform = this.createForm();
this.editform.render(pan1.el);
layout1.endUpdate();
this.detaildlg.addButton('保存', this.addOrUpdateRecord
.createDelegate(this, [this.editform]), this.detaildlg);
this.detaildlg.addButton('关闭', this.detaildlg.hide,
this.detaildlg);
}
this.editform.isnew = isnew;
if (isnew) {
this.editform.setValues( {
userId : '',
userName : '',
org : '',
phone : '',
position : '',
description : ''
});
} else {
var record = this.grid.getSelectionModel().getSelected();
if (record) {
this.editform.setValues(record.data);
}
}
//alert(this.detaildlg.el.dom.ownerDocument.body.insertAdjacentHTML);
this.detaildlg.show();
},
addOrUpdateRecord : function(form, isnew) {
var recordparm = form.getValues();
var datastore = this.grid.getDataSource();
if (form.isnew) {
var recordnew = new Ext.data.Record(recordparm);
datastore.insert(0, recordnew);
} else {
var record = this.grid.getSelectionModel().getSelected();
record.set('userId', recordparm.userId);
record.set('userName', recordparm.userName);
record.set('org', recordparm.org);
record.set('phone', recordparm.phone);
record.set('position', recordparm.position);
record.set('description', recordparm.description);
}
this.detaildlg.hide();
},
deleteItem : function() {
var datastore = this.grid.getDataSource();
var selectitems = this.grid.getSelectionModel().getSelections();
for (i = 0;i < selectitems.length; i++) {
datastore.remove(selectitems[i]);
}
},
createForm : function() {
var form = new Ext.form.Form( {
labelAlign : 'right'
});
var store = new Ext.data.SimpleStore( {
fields : ['foldercode', 'foldername'],
data : [['0001', '国内'], ['0002', '国际']]
});
var combo = new Ext.form.ComboBox( {
store : store,
fieldLabel : '所属分类',
displayField : 'foldername',
typeAhead : true,
triggerAction : 'all',
emptyText : 'Select...',
hiddenName : 'folder',
mode : 'local',
selectOnFocus : true,
width : 200
});
form.add(new Ext.form.TextField( {
fieldLabel : '信息标题',
name : 'title',
width : 450
}), combo, new Ext.form.HtmlEditor( {
id : 'desc',
fieldLabel : '内容',
width : 450,
height : 280
}), new Ext.form.TextField( {
fieldLabel : '作者',
name : 'maker',
width : 200
}), new Ext.form.DateField( {
fieldLabel : '发布时间',
name : 'mkdate',
width : 200,
allowBlank : true
}), new Ext.form.TextField( {
fieldLabel : '附件',
name : 'attach',
width : 400
}));
return form;
}
}
}();

Ext.onReady(Message.init, Message, true);

[Animal]

Looks good.

If you break at that error, what is el?

And if el is undefined, step back through the stack trace to see who originally passed something undefined.

[hanyilong]

If the el is a html document, it will break at that error. And if the el is other html element, It's ok I guess!

[Animal]

Don't guess. Break on that error line using Firebug, and see exactly what el is!

Then go back through the stack trace and see who first passed the wrong thing to where.

[hanyilong]

It's work ok in firefox, I debug the code found the el is body element. So I don't know why it work ok on firefox but on IE?

[hanyilong]

I got the problem. because my html's first element is a text. And I add a div as it's first element,It's work.