Ext.ux.MetaForm - A FormPanel configured by metadata received from server

[semiaddict]

Hi,

I'm trying to get a field's value after the form loads.

I've tried to get the value using something like

metaform.getForm().findField('fieldname').getValue()

when the metachange event fires, but the value is always empty.

Any ideas on how I can achieve this?

Best

[jsakalos]

Does the field have value at that time? Do you send values together with metadata?

[semiaddict]

Hi jsakalos,

Thank you for the lightning-fast reply!

The JSON returned with the url setting of the form looks like this:

{"params": {}, "errors": {}, "data": {"direction": "F", "task": "", "object": 10, "waypoints": "SRID=4326;LINESTRING (2.2412109371880593 41.4097758272518064, 9.1845703112215453 39.2322531371089411, 12.5244140607562464 41.9022770361742047, 11.2939453109281445 44.5591634103447092)", "behavior": "S", "speed": 0.0001}, "success": true, "metaData": {"fields": [{"fieldLabel": "Behavior", "name": "behavior", "editor": {"displayField": "display", "forceSelection": true, "xtype": "combo", "editable": true, "hiddenName": "behavior", "typeAhead": true, "valueField": "id", "mode": "local", "triggerAction": "all", "store": [["S", "Static"], ["L", "LinearMove"], ["B", "BackAndForthMove"]], "allowBlank": false}}, {"fieldLabel": "Object", "name": "object", "editor": {"displayField": "display", "forceSelection": true, "xtype": "combo", "editable": true, "hiddenName": "object", "typeAhead": true, "valueField": "id", "mode": "local", "triggerAction": "all", "store": [["", "---------"], [4, "I #4"], [5, "I #5"], [12, "I #12"], [13, "C #13"], [19, "C #19"], [9, "P #9"], [10, "C #10"], [20, "C #20"], [6, "I #6"]]}}, {"fieldLabel": "Waypoints", "name": "waypoints", "editor": {"xtype": "textfield"}}, {"fieldLabel": "Direction", "name": "direction", "editor": {"displayField": "display", "forceSelection": true, "xtype": "combo", "editable": true, "hiddenName": "direction", "typeAhead": true, "valueField": "id", "mode": "local", "triggerAction": "all", "store": [["F", "Forth"], ["B", "Back"]], "allowBlank": false}}, {"fieldLabel": "Speed", "name": "speed", "editor": {"decimalPrecision": 2, "allowBlank": false, "xtype": "numberfield", "decimalSeparator": ".", "allowDecimals": true}}, {"fieldLabel": "Task", "name": "task", "editor": {"xtype": "textfield", "maxLength": 100}}], "formConfig": {"columnCount": 1, "labelWidth": 80, "defaults": {"width": 130}, "labelAlign": "left"}}}

I'm trying to access the value of the waypoints field, which should be SRID=4326;LINESTRING (2.241210937188059.... with this JSON.
The field is populated with the correct value, but I can't seem to access its value with the metachange event. Maybe I should be using a different event?

Best

[jsakalos]

Try to get the value from Firebug console after the form is loaded. If you're able to get the value from FB then metachange event is "just too early".

[semiaddict]

I don't know how to use FB's console to get the value of the field...
If the metachange event is too early, which event should I be using?

Thank you.

[jsakalos]

I don't know how to use FB's console to get the value of the field...

You MUST learn that before anything else. Firebug is the main Ext JS developer tool - you cannot live without it.

[semiaddict]

You MUST learn that before anything else. Firebug is the main Ext JS developer tool - you cannot live without it.

Indeed, it is very useful. I didn't know you could execute js code from the console.
When I try to get the value of the field from code executed from the console, I see the form built, but not yet populated with the values when the metachange event is called.

Would you know which event I should be using instead?

[semiaddict]

I managed to get what I wanted by sending the entire result (action.result) to onMetaChange and then sending it to both beforemetachange and metachange events. This allows me to get the data part of the JSON response.
Here are my changes:

this.onMetaChange(this, action.result);

on line 354 instead of

this.onMetaChange(this, action.result.metaData);

onMetaChange:function(form, result) {
        var meta = result.metaData;

on line 430 instead of

onMetaChange:function(form, meta) {

if(false === this.fireEvent('beforemetachange', this, result)) {

on line 431 instead of

if(false === this.fireEvent('beforemetachange', this, meta))  {

and

this.fireEvent('metachange', this, result);

on line 528 instead of

this.fireEvent('metachange', this, meta);

[semiaddict]

Hi,

I'm having an issue with HTML returned in the errors and data objects.

For the errors object, if I don't escape html tags, I get the Firebug error "missing } after property list"
But if I do escape the html tags, then the tags are displayed in the error's tooltip.

form-error.png

As for the data object, if I don't escape html tags (in my case it's for an htmleditor field), the form loads just fine, but after saving I get the same error as above.
If I do escape the html tags, the form loads and saves fine, but the tags are visible in the htmleditor field.

html-tags-in-htmleditor.png

Any ideas of how I should be handling html tags in the json response?

[jsakalos]

First, I do not think that this behavior is recordform specific. Second, I think that error messages were never meant to contain html so you'll most likely need to delve into the Field code and unescape messages therein.