PDA

View Full Version : API + ExtJS



nfuids
4 Aug 2010, 6:23 PM
Hi there,

I kinda thought out how I want to architect my ext js app and wanted to get feedback from people that have more experience than I do.

Here is my scenario:

We have a RESTful API. So each of our model have a Add/Update/Delete API action.

I now have designed the form/grid for each model.

Now, I was thinking of adding a "Save" button to the form and make it call the API using AJAX or something like that.

What do you think?

darthwes
4 Aug 2010, 8:17 PM
That's a valid approach, probably the most widespread approach. You can eliminate the form through clever use of the first or last row to be an empty row that the user can fill in. But that's an architecture decision.

You don't actually have to write a custom AJAX call because you should be able to do form.getForm().submit() to do a submit @ the URL of the form.
xtype:form, url: myURL which is basically a glorified ajax request that grabs the form elements and passes their name/value pairs through to the requested url. I'm not sure what methods work (I'm pretty sure you can specify get and post on a BasicForm.submit, but GET and PUT I've never played with), but that may be moot depending on your api.

I assume you're aware of the goodies inside an editor grid backed by a restful store. That may be the best approach, though I admit programming a form to do an ajax call is simpler to code.

Also, there's alot of support for API's supported by Ext's Stores (more than just RESTful/CRUD api's, you can do all kinds of sick stuff), and while the documentation is hairy, I believe it outlines it well enough for a dedicated coder to figure out pretty quickly.

Hope some of that helped.

Animal
5 Aug 2010, 12:48 AM
All this can be driven directly through the Store. Configure it with autoSave: false so that it does not attempt to synchronize with the server upon every field change.

The Store can be loaded, and each Record (ie database row) can be mapped into a form (see BasicForm.loadRecord) and then back into the Store (BasicForm.updateRecord)

The Store synchronizes the server when you call the save() method.

nfuids
5 Aug 2010, 4:30 AM
Thanks, I will take a look at the store more carefully.

What I'm not sure I understood are the proxy.. what are they vs store?

darthwes
5 Aug 2010, 10:02 AM
Every store has a proxy. You should be defining them explicitly to tell it that you're using a restful API. The proxy is the part of the store that deals with the raw data. The store has a proxy and a list of fields, and a list of records, etc, etc. Both are necessary. You must set up your Proxy correctly in order to use an API like REST.