Monday, March 29, 2010

Building Flex 4 application for BlazeDS 4 Remoting destinations using Flash Builder 4

Everybody knows Flex 4 has great features like connecting to different backend using BlazeDS or PHP, ColdFusion, LCDS or HTTPService/Web Service.

Now you can create Flex 4 UI without doing single line of code. First you have to get the following software

1. Flash Builder 4
2. BlazeDS 4 or nightly build is fine
3. MySQL server
4. Create schema and table.
5. Create Java Class to get data from MySQL. Also create public method with return type as List(Object) so you can bind them to Flex DataGrid easily.
6. JDK 1.6 installed.
7. Tomcat 6 installed.

Please note you will have more complex things to do in real life so just take above as exercise.

1. Create Flex Project in Flash Builder and select J2EE as backend and select BlazeDS.

2. Setting BlazeDS 4.
After you copy your blazeDS.war into tomcat/webapps directory go to webapps//web.xml and make changes to RDSServlet part as following

{param-value}false{/param-value}

3. You have to set your destination in tomcat/webapps//flex/remote-config.xml

Please make sure you have Java class name in tomcat/webapps//WEB-INF/classes directory.

4. Select "Data" --> "BlazeDS" from Menu option of Flash Builder. In new window it will show you destination name i.e. {servicename} from step 3. Click on checkbox next to it and click on "Finish" button.


5. After that drag DataGrid component in Flex Project using Component view. Still in Component view right click on DataGrid and select "Binding Data" option. It will prompt you to select service and method name. If you have more than one method select one you want more combobox.

After that everything is done by Flash Builder.

RUN You application to see data populated in datagrid without single line of coding in Flex 4.

You can also create free form i.e. (mx:Form) for the same method call on destination. If you have method call findAll() for users or anything else it will create form with option to hand pick required field for edit, update or delete operation.


Enjoy,
Nehul

No comments: