Ext.Direct Form Integration - extjs

Question

I am using Ext.direct.RemotingProvider . At the server side I make some validation checks. The Respond is send back in JSON format.
If i find any errors when making validation checks, the field success = false, and errors will contain the error.
I am trying to figure out, how do i reflect errors i found in the server side in the form (client side).
In the link below there is an example of what i want to achieve. When the client press on "submit" an error message will occur in the form, how does it work ?
Example
In the code i post in the bottom the following happens:
in the browser there are 2 fields (Name,Email) and 2 buttons.
the fields are irrelevant for now. they are used as dummies.
Each time the user press on "Add" button, a new action is added into callBuffer of Ext.direct.RemotingProvider
When the user press on "Apply" button, all the actions are being sent to the router (MVC model) and from there to a specific controller. (the function sfw.Direct.getProvider('sfwProvider').combineAndSend() is triggered).
As for now, i intentionally fails the respond and create an error field, just like the example link i added in the beginning of the Thread.
i put in the errors field {email="Already exists"}.
but i see not effect in the form..
what am i doing wrong ?
Code:
appWiki.main_panel = new Ext.FormPanel({
renderTo: 'extjs_panels_container'
, id: 'appWiki_main_panel'
, name: 'appWiki_main_panel'
, defaultType: 'textfield'
, items: [
{
fieldLabel: 'Name',
name: 'name'
}
,{
fieldLabel: 'Email',
msgTarget: 'side',
name: 'email'
}]
,buttons:[
{xtype: 'sfw.Button'
, text: 'Add'
, handler: function(){sfw.rule.store.api.readByRowId({data: {_ROWID_: 1}});}
}
,{text: 'Submit'
, handler: function(){
appWiki.main_panel.getForm().submit({
});
}
}]
,api: {
// The server-side must mark the submit handler as a 'formHandler'
submit: sumbitAllRequests
}
, load: function()
{
setTimeout("hide_loading_mask()",2000);
}
});

Answer 1

In the JSON response you need the following structure
{ "result" : { "success": false, "errors": { "name of field" : "validation message" } }
Where "name of field" is the name config option in your field, and "validation message" is the message you want to display to the user.
When you send a response like that ExtJS will take care of the rest.
EDIT: You may also need to enable QuickTips:
Ext.QuickTips.init();
Add that line before you declare your form
EDIT 2: Also, make sure you're using the submit() method found on the BasicForm:
buttons:[{
text: 'Submit',
handler: function(){
basicInfo.getForm().submit({
params: {
foo: 'bar',
uid: 34
}
});
}
}],