PDA

View Full Version : Create uneditable text block



UbuntuPenguin
17 Jul 2012, 6:26 PM
Hello Everyone,
I am using ExtJS and I would like to have a block of text that can't be edited by the user. I have tried using the html config of the panel as my text block ( panel.body.dom.innerHTML = instructions; ) but it doesn't seem to pay attention to line breaks. I have tried using a TextAreaField component which does appear to respect my line breaks but unfortunately allows the user to edit the text. Upon reading the API I didn't seen an 'editable=true/false' option on the TextAreaField class.

Any help is greatly appreciated.
Sincerely,
Ubu.

scottmartin
17 Jul 2012, 7:03 PM
Can you use readOnly?



Ext.create('Ext.form.FormPanel', {
title : 'Sample TextArea',
width : 400,
bodyPadding: 10,
renderTo : Ext.getBody(),
items: [{
xtype : 'textareafield',
grow : true,
value : 'This is a TextAreaField',
readOnly : true,
name : 'message',
fieldLabel: 'Message',
anchor : '100%'
}]
});


Scott.

vadimv
17 Jul 2012, 10:59 PM
Hmmm.....sth you are doing wrong there, post some code or take a look at the one below, which is fairly simply:


var panel = Ext.create('Ext.panel.Panel', {
title: 'Hello',
width: 200,
html: '<p>World! fdsfsdf line break</br>fsdfsdf sdfs dfs break</br>sdffsdfsd sdfsdfd</p>',
renderTo: Ext.getBody()
});


panel.update('<div>vvvvvvv break</br> dfdfdf one more break</br> kkkkkkkk another break<div>');

UbuntuPenguin
18 Jul 2012, 5:36 PM
Thanks everyone. Your suggestion was the correct one Scott, worked like a charm.