PDA

View Full Version : FormPanel within Window Fit And HtmlEditor Readonly Problem



zamkinos
5 Apr 2010, 1:02 PM
this is the window.

win = new Ext.Window({
applyTo:'pnlPopup',
layout:'fit',
width:550,
height:390,
closeAction:'hide',
plain: true,
autoScroll : true,
modal: true,
loadMask:true,
maximizable:true,
items: new Ext.Panel({
applyTo: 'pnlPopupIcerik',
deferredRender:false,
border:true
}),
buttons: [{
text: 'Kapat',
handler: function(){
win.hide();
}
}]
});it's in a hidden div in page.

<div id="pnlPopup" class="x-hidden">
<div class="x-window-header" id="divHikayeBaslik">...Hikaye...</div>
<div id="pnlPopupIcerik" style="width:97%; padding:9px 5px 9px 9px; text-align:justify;">
</div>
</div>this is my form panel. it has only a htmleditor and three buttons.


var top = new Ext.FormPanel({
labelAlign: 'top',
frame:true,
title: 'Hikaye Duzenle',
bodyStyle:'padding:1px 1px 0',
//width: 540,
renderTo: '_divForm',
id: 'divForm',
items: [{
xtype:'htmleditor',
id:'divDuzenleIcerik',
fieldLabel:'Icerik',
height:200,
anchor:'100%'
}],
buttons: [{
text: 'Kaydet'
},{
text: 'Vazgec'
},{
text: 'Temizle',
handler: function(){ Ext.getCmp('divForm').form.reset(); }
}]
}); formpanel is in a hidden div.

<div id="_divForm" class="x-hidden">
&nbsp;
</div>when a link is clicked this function is triggering and put the formpanel in window.


function hikayeyiDuzenleSil(pHikayeId, pIslem)
{
Ext.getDom("pnlPopupIcerik").innerHTML = '';
Ext.getDom("pnlPopupIcerik").appendChild(Ext.getDom("divForm"));
if(win.hidden)
win.show();
}first, less important question is why form panel does not fit in window.
second question is, why html editor is readonly.

note: i use this window to edit a article(with formpanel in it) or show the article(with nothing in it).

regards.

zamkinos
6 Apr 2010, 12:01 PM
js file

var win = null ;
var top = null;
Ext.onReady(function () {
........
........
........
win = new Ext.Window({
applyTo:'pnlPopup',
id: 'winPopup',
layout:'fit',
width:550,
height:390,
closeAction:'hide',
plain: true,
autoScroll : true,
modal: true,
loadMask:true,
maximizable:true,
items: new Ext.Panel({
applyTo: 'pnlPopupIcerik',
deferredRender:false,
border:true
}),
buttons: [{
text: 'Kapat',
handler: function(){
win.hide();
}
}]
});


top = new Ext.FormPanel({
labelAlign: 'top',
frame:true,
title: 'Hikaye Duzenle',
bodyStyle:'padding:1px 1px 0',
//width: 540,
renderTo: '_divForm',
id: 'divForm',
items: [{
xtype:'htmleditor',
id:'divDuzenleIcerik',
fieldLabel:'Icerik',
height:200,
anchor:'100%'
}],
buttons: [{
text: 'Kaydet',
id:'btnKaydet',
formBind: true,
listeners: {
click: function(){
if(top.getForm().isValid()){
sayfayiYukle('6') ;
}
}
}
},
{
text: 'Temizle',
handler: function(){ Ext.getCmp('divForm').form.reset(); }
}]
});

// when i show the window in here, htmleditor is editable
win.show();
Ext.getDom("pnlPopupIcerik").innerHTML = '';
Ext.getDom("pnlPopupIcerik").appendChild(Ext.getDom("divForm"));
});


//but when i call this function to open the window, the htmleditor is non-editable.
function hikayeyiDuzenleSil(pHikayeId, pIslem)
{
Ext.getDom("pnlPopupIcerik").innerHTML = '';
Ext.getDom("pnlPopupIcerik").appendChild(Ext.getDom("divForm"));
win = Ext.getCmp('winPopup') ;
if(win.hidden)
win.show();
}
aspx page


<div id="pnlPopup" class="x-hidden">
<div class="x-window-header" id="divHikayeBaslik">...Hikaye...</div>
<div id="pnlPopupIcerik" style="width:97%; padding:9px 5px 9px 9px; text-align:justify;">
</div>
</div>

<div id="_divForm" class="x-hidden">
&nbsp;
</div>

any suggestions?
regards.

Animal
6 Apr 2010, 12:25 PM
do not use any html at all

zamkinos
8 Apr 2010, 8:19 AM
do not use any html at all
why?