PDA

View Full Version : extjs 4.2 htmleditor not rendering textarea



tobias@hunique.nl
1 Nov 2013, 9:46 AM
I'm using Extjs for some things, and now i'm trying to get a form to have the ability to use a HTML editor.


It seems to load fine, i don't get errors on any console. and everything works fine, but my editor doesn't actually "finish" rendering it seems.


46671


The picture shows what i see. below is the extjs part of the form



var contents_form = Ext.create('Ext.form.Panel', {
id: 'contents_form',
frame:true,
bodyStyle:'padding:5px 5px 0',
width: 250,
autoScroll:true,
standardSubmit: true,
fieldDefaults: {
msgTarget: 'side',
labelWidth: 75
},
defaultType: 'textfield',
defaults: {
anchor: '100%'
},
items: [{
xtype:'hidden',
name: 'id',
render: function (val){
if (val){
return val;
}
return 'new';
}
},
{
name: 'title',
allowBlank: false,
fieldLabel: 'Title ',
},
{
id : 'htmlEditor_Content',
name: 'content',
xtype: 'htmleditor',
enableColors: false,
enableAlignments: false,
html: ''
},
],


I've tried to place the editor in a window that pops open after a button click and that renders fine. So oddly it doesn't want to do that in my form next to my grid....


I tried all kinds of variations within the editor item itself, and it has a unique id. I tried leaving off and adding several params but nothing seems to change the working of it.

steffenk
1 Nov 2013, 11:04 AM
it renders fine. I just checked it


Ext.onReady(function() {


Ext.create('Ext.form.Panel', {
id : 'contents_form',
renderTo : document.body,
frame : true,
bodyStyle : 'padding:5px 5px 0',
width : 250,
autoScroll : true,
standardSubmit: true,
fieldDefaults : {
msgTarget : 'side',
labelWidth: 75
},
defaultType : 'textfield',
defaults : {
anchor: '100%'
},
items : [
{
xtype : 'hidden',
name : 'id',
render: function(val) {
if (val) {
return val;
}
return 'new';
}
},
{
name : 'title',
allowBlank: false,
fieldLabel: 'Title ',
},
{
id : 'htmlEditor_Content',
name : 'content',
xtype : 'htmleditor',
enableColors : false,
enableAlignments: false,
html : ''
}
]
});


});


So your problem could be some extra comma or other error in your other code.
You also use id's which should not be used. Are you maybe use same id twice? Remove them and use itemId instead.