ExtJS Ajax-Communication with PHP
Hi, i have just read in the last week documentation regarding ExtJs. My personal reviews are it is a very intuitive framework. I have spend a lot less time learning what I have accomplished here compared to the times of Adobe Flex 3.
This application is in part some fragments of other tutorials I have gone through Sencha ExtJS Documentation. I was able to put together this small application which uses PHP as its backend. I think is a valuable demo as you might want to try Java, .NET, or another technology instead of PHP.
Demo I
Static content in php to send to ExtJs Application. Within one JS file, you get a taste of the Model, Store, and a datagrid. Here we make use of Model, and Store. The Store was a Flex flashback to ArrayCollection in a way but being directly bound to an HTTPRequest object.
url: http://blog.flexnroses.com/source/tutorial/extjs/proxy_demo/static_ajax.php
php file called: http://blog.flexnroses.com/source/tutorial/extjs/proxy_demo/php/static_ajax.php?action=read
Demo 2
Here the only difference is the php file now is able to call a page which is loading its content from a database table. Still no use of MVC pattern.
url: http://blog.flexnroses.com/source/tutorial/extjs/proxy_demo/dynamic_ajax.php
json: http://blog.flexnroses.com/source/tutorial/extjs/proxy_demo/php/dynamic_ajax.php?action=read
Demo 3
This time we use the MVC pattern from ExtJS, and we start to include two controllers to detect mouse click actions in different views for us to now CRUD the data in the database table.
I figured after a few test that the communication involved post data being sent to PHP. So I managed to retrieve it and decode it from Json format.
Instructions: double click any record in datagrid, and you can edit and save your changes, or delete.
In the main application there is also a button to create a new record.
Note: As far as this example has gone, it has no bells and whistles. It lacks validations, and update status upon CRUD operations. That’s something coming next.
URL: http://blog.flexnroses.com/source/tutorial/extjs/proxy_demo/ajax_app.php
PHP: same file as the one before.
The goodies
If you test my application, you can see updates in this log text file.
http://blog.flexnroses.com/source/tutorial/extjs/proxy_demo/php/logger/error_log.txt
Last but not least, you can get the joy of this application and make use of it for your current learning. You can download it here, and also get the mysql file to test.
As a good neighbor share your thoughts and any suggestions to improve my ongoing learning. I plan ahead to go into using Direct, Session, and LocalStorage.
gracias
