new Ext.form field type - MiscField

[talshadar]

But I'm having a problem getting the spacing in IE working properly.

I'm using the miscelField to hold some info fed from the selection of a combo box. Unless they select a certain value, the miscel field needs to be hidden. Only shown(and filled) if they select the value I specify.

I have tried several different things and the following is the only thing I can get working 1/2 right. otherwise it shows the info in the top corner instead of below the combo box.

        interfaceInfoPlaceholder = new Ext.form.MiscField("interfaceSelection",{
            fieldLabel:" ",
            labelSeparator: "", 
            id: "interfaceInfo",
            width:350,
            hideMode: "visibility"
        });

        frmActionItem.add(interfaceInfoPlaceholder);


        txtInterfaceInfoPlaceholder = Ext.get("interfaceSelection");
        txtInterfaceInfoPlaceholder.hide();
        txtInterfaceInfoPlaceholder.setStyle("display","none");

        //these give an error - container is null
        //txtInterfaceInfoPlaceholder.container.up("div.x-form-item").hide();
        //txtInterfaceInfoPlaceholder.container.up("div.x-form-item").setStyle("display","none");

any suggestions would be helpful.

[willf1976]

Hi All

This is a very nice and very useful extension. Thanks for building it .

I had a few problems with it though that I thought I would report --

First of all the applyTo function seems to be overwriting a property that ext is expecting to use. In order for make the class work I had to pass in an applyTo value of null in its config.

Also I couldn't get the class to work with out lazily instantiating it.

So I added this line of code to the end of the class:

Ext.reg('form-miscfield', Ext.form.MiscField);

Here is an example of what did and didn't work for me:

Ext.onReady(function(){
	//Works:
	var testMiscField = {
		xtype : 'form-miscfield',
		fieldLabel: 'MiscField',
		id: 'miscfield',
		width: 160,
		value: 'blah blah blah',
		applyTo : null
	},
	form = new Ext.FormPanel({
		items : [testMiscField],
		renderTo: document.body
	});
	
	//Doesn't work:
	var testMiscField = new Ext.form.MiscField({
		xtype : 'form-miscfield',
		fieldLabel: 'MiscField2',
		id: 'miscfield2',
		width: 160,
		value: 'blah blah blah'
	}),
	form = new Ext.FormPanel({
		items : [testMiscField],
		renderTo: document.body
	});
});

I should also note that I am using version 3.0.1 of ext

Keep up the good work.

Best Regards

Will Ferrer

[tenBoxelulley]

very nice map-tried doing something like this a few times, but never worked, so thanks

[bclinton]

Yes, I know this post is very, very old. But seeing tenBoxelulley's post I'm not the only one who has found it while looking for a way to add a form item with text rather than an input field. There is no need for an extension to do this in ExtJS 3. You can use Ext.form.DisplayField