0

I have a project where a user will go to username.website.com.

Once the page loads, there will be an HTML form that displays whatever information we have on the user in an HTML form. If there is a missing piece of information about the user, they will update it.

There is also a side area that contains a flex 3 application. At the bottom of the flex app, there's a submit button.

I need to make it so that when the user hits the submit button from within the flex app, the current value of the html fields is sent to the flex app so that the html data as well as the data from within the flex app can be transmitted with a URL request.

So basically, when the user hits the submit button within the flex app, I'd like for the data from the html fields as well as the flex fields to be combined and sent.

Brds
  • 1,035
  • 3
  • 17
  • 37
  • You can retrieve the values of your form from within the Flex app - more info in this link --> http://stackoverflow.com/questions/7207880/html-form-post-to-flex-app from there you can send the data (although not sure how you are "sending"). You may also choose to "combine data" in the opposite order using ExternalInterface calls from within Flex (mentioned in the link). – Goose Oct 22 '12 at 20:50
  • This appears to only work with onload... and by that I mean it won't pick up the values of the html fields if they're changed by the user. Or did i completely misread that? – Brds Oct 22 '12 at 20:53
  • 1
    The second link in that question is probably more of what you are looking for (FlashVars would be for on load only, its basically like a query string). Using ExternalInterface you can call javascript from actionscript and vice versa. Check out the link posted (Adobe help docs) or just search for ExternalInterface and you will find a lot of examples. – Goose Oct 22 '12 at 20:57

1 Answers1

1

Here's how I ended up doing it (for any future viewers of the thread):

Actionscript code:

Import the right class:

import flash.external.ExternalInterface;

Create the function to call the JS function

private function getFormValues():void
{
    firstName = ExternalInterface.call("getJSVar", "firstName");
    lastName = ExternalInterface.call("getJSVar", "lastName");
    address = ExternalInterface.call("getJSVar", "address");
    phone = ExternalInterface.call("getJSVar", "phone");
    email = ExternalInterface.call("getJSVar", "email");
}

(My variables [firstName, lastname, address, phone, and email] are defined as bindable strings)

Create the javascript function to get the latest values, and return them:

<script type="text/javascript">
    function getJSVar(varName)
    {
        var toReturn = "Nothing Sent";
        if (varName == "firstName")
            toReturn = document.forms["userInfo"].firstName.value;
        else if (varName == "lastName")
            toReturn = document.forms["userInfo"].lastName.value;
        else if (varName == "address")
            toReturn = document.forms["userInfo"].address.value;
        else if (varName == "phone")
            toReturn = document.forms["userInfo"].phone.value;
        else if (varName == "email")
            toReturn = document.forms["userInfo"].email.value;

        return toReturn;
    }
</script>

Here's my html form too:

<form action='#' method='post' name="userInfo">
    <table width='100%'>
        <tr>
            <td align='center'><input type='text' id="firstName" name="firstName" value='First Name' style='width:250px;' /></td>
            <td align='center'><input type='text' id="ymm" name='ymm' value='Year Make Model' style='width:250px;' /></td>
        </tr>
        <tr>
            <td align='center'><input type='text' id="lastName" name='lastName' value='Last Name' style='width:250px;' /></td>
            <td align='center'><input type='text' id="address" name='address' value='Address' style='width:250px;' /></td>
        </tr>
        <tr>
            <td align='center'><input type='text' id="phone" name='phone' value='Phone Number' style='width:250px;' /></td>
            <td align='center'><input type='text' id="email" name='email' value='Email Address' style='width:250px;' /></td>
        </tr>
    </table>
</form>
Brds
  • 1,035
  • 3
  • 17
  • 37