Flash_and_Flex_03_2009

Server Side Interaction

FLEXing Your Business Application

by Mitchell M. Maynard

When I first saw FLEX demos I thought This is a great technology for those guys that build web applications with lots of pictures and simple shopping cart functionality, but it isn’t robust enough to handle a REAL business application. Well I am happy to say, I was wrong!

ABCBusinessApp.mxml page in your default internet browser. The page will be blank but there is a background color; it is the default. Let’s take a look at the components available within the choices offered by Flex 3 – Professional. Back on your project select the design view of the ABCBusinessApp.mxml so we can initiate the WYSIWYG editor. Now we can see the Components tab within the display on the lower left-hand corner of the IDE. You will findmany of the same component offered in other IDE’s like Microsoft Visual Studio but you will also find a selection of charting components and an Advanced Data Grid. If you are like me, I have purchased licensing to third-party tools that provide me the added functionality not provided by the IDE like charting and advanced components for data display). Since these advanced visualization components are build by Adobe, we know that they are well integrated. Before moving forward with adding components to our ABCBusinessApp, let’s use a wizard feature to build a data-driven page. From the menu choices at the top of the IDE click Data -> Create Application from Database, see (Figure 1). The wizard will take you through a few steps that will allow you to: • Make a connection to your database. Click New to create a new connection to your database. • Select the table. We will use StructuredDat aFromInputs . • Select the Primary key. Click Next . • By default the class name for the Web Services will be the same name as your database table. With ASP.Net web services, you are allow to select the language of your choice; C# or Visual Basic. (For this example we will use C#) Click Next . • This last step allows you to select the fields within the table for the form and you can select the field to filter records. Click Finish .

What you will learn… • How to create a Flex Project • Build User Interface • Build an ASP.NET WebService • Retrieve Data from SQL Server and bind it to an AdvancedDataGrid

What you should know… • Download and install Flex Trial • Understand MS C# • Understand MS SQL Server T-SQL

Step 2

• Server

select

Use

ASP.NET

Level of difficulty

Development Server. • Server Location is disabled- no selection necessary. • Compiled Flex application location – default is flex _ bin (leave it). This is the destination of the compiled project files for deployment to your web server. Click Finish and you are done! Now that you project is created, you will notice it in the Flex Navigator and the files within are expanded. There will be the following file folders: • flex _ bin – used to store the compiled project for deployment, • html-template – files used by flex; we will ignore, • libs – file storage for project; we will ignore, • src – this is the folder we will use to create all of our web forms and actionscript files. We can also create file folders for storing images used in the application. You will notice that there is an mxml file that is there with the same name as our project. This file acts much like a default page. In fact, the little blue dot on the page image denotes it attribute as the start page. Now that we have created the project, simply click the Run button in the toolbar of Flex and you will see it start the project displaying the

T he purpose for this article is to present how a typical data-driven business application can be accomplished with FLEX 3. Most business application development is done with an N-teir design that we will implement using the following technologies • Flex 3 – User Interfaces Development • ActionScript 3 – Client Side Coding • MXML – Client Side Component Manipulation • AdvancedDataGrid – Flex 3 Professional • ASP.NET – Database Communications Layer in C# • SQL Server 2005 – Database • Coldfusion Report Builder – Reporting

First we need to start with the creation of a new Flex Project.

Step 1

• Simply select a new Flex Project and call it ABCBusinessApp. • The application type of project will be Web application (runs in Flash Player). • The Server technology that we will use is: Application server type: ASP.NET.

03/2009 (5)

72

Made with FlippingBook HTML5