Search:
  • Home
  • Examples
    • Thumb

      Flex Examples

      Check out our Flex Examples!

    • Thumb

      Flash Builder Examples

      Check out our Flash Builder Examples!

    • Thumb

      AIR Examples

      Check out our AIR Examples!

    Adobe® Flex, Adobe® Flash Builder and Adobe® AIR are registered trademarks of Adobe Systems.
  • Components
    • Thumb

      WP Flex Contact Form

      Check out our WP Flex Contact Form!

    • Thumb

      Flash CountDown Plugin

      Check out our Flash CountDown Plugin!

    This is an overview of all our Flash/Flex based Components.
  • Jobs
  • Guest Poster
  • Forum
  • Contact Us
Subscribe to Flex BlogSubscribe
  • Examples
Browse > Home / Examples / Simple Flex & PHP Example

Simple Flex & PHP Example

14 February 2009

Line Break

Author: Arjan (34 Articles) - Author Website

Arjan is a SAP Consultant specialized in ABAP and Front End development techniques like Web Dynpro, Adobe Interactive Forms, Flex and AIR. In his free time he likes to create examples for Flex-Blog and other applications using Flex, AIR and PHP. Other hobbies are movies and music. He is also the co-owner of Flex-Blog.com.


How do i get my data from Flex to PHP? I wondered about this a year or so ago when I was just getting to know Flex. I have to admit that my PHP skills are not that good, I can get things in and out of MySQL databases and that’s about it. But enough about me, let’s make a simple Flex application that calls some PHP script on the server.

Ok to keep it simple i’m just going to create a function that concatenates two string that are filled in in the Flex application and the result is send back.

First we need a screen with two TextInput fields, One Text output field and a Button to trigger the application to call the script:

1
2
3
4
5
6
7
8
9
10
11
12
13
<mx:VBox top="10" left="10">
    <mx:HBox verticalAlign="middle">
        <mx:Label text="String 1:"/>
        <mx:TextInput id="stringOne"/>
    </mx:HBox>
    <mx:HBox verticalAlign="middle">
        <mx:Label text="String 2:"/>
        <mx:TextInput id="stringTwo"/>
    </mx:HBox>
    <mx:HRule width="100%"/>
    <mx:Button label="Concatenate!" click=""/>
    <mx:Text text=""/>
</mx:VBox>

The click event of the Button doesn’t do anything yet, and the output text is not determined yet. We will get to that later.

Ok let’s do some PHP. Put the following PHP script on your server somewere, let’s call it concat.php:

1
2
3
4
5
6
7
8
<?php

$stringOne = $_POST['stringOne'];
$stringTwo = $_POST['stringTwo'];

print $stringOne . $stringTwo;

?>

Now to call that script, we are going to use the HTTPService component. We have to specify an id, url, message and a resultFormat. Furthermore, we have to specify the request inside the HTTPService tag:

1
2
3
4
5
6
7
8
9
10
11
12
13
<mx:HTTPService
id="concat" url="concat.php"
resultFormat="text"
method="POST">

    <mx:request xmlns="">

        <stringOne>{stringOne.text}</stringOne>
        <stringTwo>{stringTwo.text}</stringTwo>

    </mx:request>

</mx:HTTPService>

The tag names inside the request are very important: they must match the post variables that you’re expecting in your PHP script, and they are ofcourse, case sensitive.

The values of the two input fields appear inside the stringOne and stringTwo tags, using a binding expressing on the text property of the component.

Ok now all we need to do is adding some code to the Button we created earlier. This code will trigger the application to send the HTTPService request to the server:

1
<mx:Button label="Concatenate!" click="concat.send()"/>

Finally, add code to the Text component at the bottom of your application to show the result. We can achieve this by binding the text property to the lastResult property of the HTTPService.

1
<mx:Text fontSize="14" text="{concat.lastResult}"/>

Ok, when we put it all together it should look something like the following example, use right mouseclick > view source to view the complete sourcecode.

Related posts:

  1. TinyURL usage with Flash Builder
  2. Flex Custom Event Example
  3. Progressbar in Datagrid Example
  4. Using the Repeater in Flex
  5. Image as Button in a DataGrid

Written by Arjan · Filed Under Examples 

Was this post useful to you?

1 Star2 Stars3 Stars4 Stars5 Stars (1 votes, average: 4.00 out of 5)
Loading ... Loading ...

Comments

Get Adobe Flash player

  • Sponsors

  • Popular Tags

    • AdvancedDataGrid
    • AIR
    • ArrayCollection
    • baseColor
    • Button
    • ButtonBar
    • ComboBox
    • CursorManager
    • DataGrid
    • Effects
    • File
    • Flash Builder
    • Flash Builder 4
    • Flashvars
    • Flex 4
    • HSlider
    • Icon
    • Image
    • itemRenderer
    • LinkBar
    • MouseWheel
    • PHP
    • ProgressBar
    • Repeater
    • Style
    • Timer
    • Tree
    • Twitter
    • ViewStack
    • VSlider
  • Flex Blog Readers

  • Testing..

  • Flex Jobs (from Flex Jobs.org)

    Your Job here? Post your job @ Flex Jobs.org

    Advertisement

  • Recent Posts

    • How to make a magnetic button in Flex 4
    • Using ASDoc as an External Tool in Flash Builder 4
    • Flex Encryption (MD5, SHA1, SHA224, SHA256, HMAC)
    • The SWIZ framework for Flex 3 / Flex 4: Easy, Light and Very Powerfull
    • Call Javascript function from Flex / Flash Builder (AS3)
    • Flex FlashVars in AS3 Example
    • Data Dependant Tree Icon with Tree in AdvancedDataGrid with iconFunction
    • WordPress Flash / Flex Comments Form
    • Adobe AIR SQLite Example
    • Flex 4 Effect Example: Sliding text using the Move Effect
  • Categories

    • Examples
    • Guest Poster
  • Archives

    • June 2010
    • May 2010
    • April 2010
    • March 2010
    • February 2010
    • January 2010
    • December 2009
    • November 2009
    • October 2009
    • March 2009
    • February 2009
  • Blogroll

    • Adobe Flex Jobs
    • NL for Business
  • Meta

    • Register
    • Log in
    • WordPress
    • XHTML

Copyright © 2010 Flex Blog · AdobeĀ® and AdobeĀ® Flex are registered trademarks of Adobe Systems.

WordPress Adobe Flex Adobe Flash Builder Adobe AIR Creative Commons License

  • Popular Posts

    • Progressbar in Datagrid Example 6 votes, average: 5.00 out of 56 votes, average: 5.00 out of 56 votes, average: 5.00 out of 56 votes, average: 5.00 out of 56 votes, average: 5.00 out of 5 (5.00 out of 5)
    • List Directory with AIR in Flex 4 6 votes, average: 5.00 out of 56 votes, average: 5.00 out of 56 votes, average: 5.00 out of 56 votes, average: 5.00 out of 56 votes, average: 5.00 out of 5 (5.00 out of 5)
    • Data Dependant Tree Icon with Tree in AdvancedDataGrid with iconFunction 5 votes, average: 5.00 out of 55 votes, average: 5.00 out of 55 votes, average: 5.00 out of 55 votes, average: 5.00 out of 55 votes, average: 5.00 out of 5 (5.00 out of 5)
    • Control Webpage in HTML Control in AIR 4 votes, average: 5.00 out of 54 votes, average: 5.00 out of 54 votes, average: 5.00 out of 54 votes, average: 5.00 out of 54 votes, average: 5.00 out of 5 (5.00 out of 5)
    • WordPress Flash / Flex Comments Form 4 votes, average: 5.00 out of 54 votes, average: 5.00 out of 54 votes, average: 5.00 out of 54 votes, average: 5.00 out of 54 votes, average: 5.00 out of 5 (5.00 out of 5)