Interactive IQ : The Hessler Design Blog » PHP http://www.hesslerdesign.com/blog Smart Developers = Smart Websites Thu, 26 Jan 2012 23:00:19 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 Formatting Raw Numbers with Commas http://www.hesslerdesign.com/blog/tutorials/formatting-raw-numbers-with-commas/ http://www.hesslerdesign.com/blog/tutorials/formatting-raw-numbers-with-commas/#comments Tue, 26 Oct 2010 14:48:44 +0000 Anthony http://www.hesslerdesign.com/blog/?p=637 I’ve worked on a number of Flash projects where I’ve needed to convert a raw number into a correctly comma-formatted string for display.  Doing this is a relatively simple process, but since I found myself repeating the same chunk of code in multiple projects, I ended up creating a function that I could reuse over and over again. And the nice thing about this chunk of code is that, with a few language-specific modifications, you can use it as JavaScript, PHP, etc.

// This variable gets set as 1,234,567,890
var commaFormattedNumber:String = formatWithCommas("1234567890");

function formatWithCommas(pNum_str:String):String {
   var lReturn_str:String = "";
   var lStringAsArray_arr:Array = pNum_str.split("");
   var commaCounter_num:Number = 1;
   for (var i=lStringAsArray_arr.length-1; i>=0; i--) {
      lReturn_str = lStringAsArray_arr[i] + lReturn_str;
      if ((commaCounter_num == 3) && (i != 0)) {
         lReturn_str = "," + lReturn_str;
         commaCounter_num = 1;
      } else {
         commaCounter_num++;
      }
   }
   return lReturn_str;
}

Notes:

  • In our example, we pass in 1 String value into the function, and it returns a String.
  • Inside of the function, we split the passed-in string into an Array, then we loop through the array backwards, adding the number in each array slot each time through the loop.
  • While looping through the array, notice that we have the variable commaCounter_num, which keeps track of which slots to also add in a comma. The conditional logic checks if the commaCounter_num is up to 3 and if the value of i is NOT zero. If both of these are true, we add in a comma and continue on. We must add the check of ensuring that i is not zero, so we don’t get a 6-digit number, for example, that ends up being returned with a comma at the very beginning of the string.

So there you have it.  A nice little chunk of code you can use to format a number into a correctly comma-formatted string. Not a whole lot to it, but still a nice reference function to have for future use.

Until next time, happy coding!

]]> http://www.hesslerdesign.com/blog/tutorials/formatting-raw-numbers-with-commas/feed/ 0 Making Your Web Page Elements More Dynamic with PHP Variables http://www.hesslerdesign.com/blog/tutorials/making-your-web-page-elements-more-dynamic-with-php-variables/ http://www.hesslerdesign.com/blog/tutorials/making-your-web-page-elements-more-dynamic-with-php-variables/#comments Thu, 30 Sep 2010 18:08:00 +0000 Anthony http://www.hesslerdesign.com/blog/?p=629 One of my little PHP tricks I have become a big fan of is having a set of variables at the top of each file that I use to populate values later on in the file. For instance, I often bulk all of my <head> tag content into one file, and then have a “include_once("headTag.php");” to write it into each file in which it needs to be. If I do this though, I’m stuck with the same page title, description, etc. Or am I?

If I include a standard set of variables at the very top of each of my PHP files for my site, I can then utilize those variables in any file that is written into that file. So if I want a custom page title on each page, I can make a variable named $pageTitle_str, and set it equal to whatever I want to be the page title for that particular page.  Then, in the file that includes all of the <head> tag content, I would have a little PHP logic to echo that into the <title> tag.  And if I use conditional logic to echo it in, I can set the title to a default value in case the variable isn’t found.

Here’s how it’s done. In the example below, I have the PHP code for a fictitious page in my site that will be placed on the top of that file. I also have the <title> tag for the file that is written into this fictitious page, which includes the conditional logic to echo in the variable for page title.

File – fictitious.php
Code Snippet:
   <?php
   $pageTitle_str = "Custom Page Title";
   ?>

File – headTag.php
Code Snippet:
   <title><?php if ($pageTitle_str) { echo $pageTitle_str; } else { echo "Default Page Title"; } ?></title>

And that’s all there is to it. The <title> will be written out whether the variable exists or not. And if you include the variables on each page, you can do WAY more than just setting page title. You can set sections and subsections for use in styling in a top navigation file, or have custom descriptions or keywords for the <head> tag on each individual page. The possibilities are endless.

Until next time, happy coding!

]]> http://www.hesslerdesign.com/blog/tutorials/making-your-web-page-elements-more-dynamic-with-php-variables/feed/ 0 Bulletproof Your Online Forms for Mobile Devices with PHP – Part 2 http://www.hesslerdesign.com/blog/tutorials/bulletproof-your-online-forms-for-mobile-devices-with-php-%e2%80%93-part-2/ http://www.hesslerdesign.com/blog/tutorials/bulletproof-your-online-forms-for-mobile-devices-with-php-%e2%80%93-part-2/#comments Tue, 10 Aug 2010 16:50:54 +0000 Anthony http://www.hesslerdesign.com/blog/?p=566 In the last post, we explored how to set up an online form using HTML and PHP. In this post, we’re going to finish setting up the logic to store form field values and validate the form.  If you haven’t read the last post and want to catch up, please click here to go to part 1.

Step 1: Add PHP Functions for Setting/Resetting Variables

In the last post, we set the form up so the value for each form field is set to a corresponding PHP variable. Now we need to make sure that when the form field changes and a user action (like submitting the form) takes place, the PHP variables get set to the newly updated form field values.  This is a simple process, as we just have to create a function to set the PHP variables.  And while we’re at it, we can create another function to reset the PHP variables for our ‘Clear Form’ button.  Here are the functions we’ll use.  Note that we need to use the ‘global’ keyword inside the functions to access and successfully update the variables.

function setVariables() {
   global $user_name;
   $user_name = $_POST["user_name"];
   global $user_email;
   $user_email = $_POST["user_email"];
   global $user_message;
   $user_message = $_POST["user_message"];
}
function resetVariables() {
   global $user_name;
   $user_name = "";
   global $user_email;
   $user_email = "";
   global $user_message;
   $user_message = "";
}

Again, these functions will eventually get called when a user clicks on the Submit or Reset button, respectively.

Step 2: Add PHP Functions for Form Field Validation

Now it’s time to write out the validation functions for the form.  In our example, we have three fields.  The name and message fields will be a simple character count for their validation.  In the email validation, we will use one of the well known regular expressions that will check the email value for correct syntax.

For the simple text input, we’ll create a function that accepts two arguments.  The first argument will be the value to get validated, and the second will be the minimum number of characters that need to be present in the first value.  Inside the function, there will be some simple conditional logic that will check the string length of the first value to the minimum number of characters.  We’ll also set a return value of ‘y’ or ‘n’ so we’ll know whether or not our value is valid.  Here’s what our simple text input validation function will look like:

function validateTextInput($str, $minLength=1) {
   if (strlen($str) < $minLength) {
      $lValid = 'n';
   } else {
      $lValid = 'y';
   }
   return $lValid;
}

For the email validation function, we’ll simply pass in the value to check as the one and only argument.  Inside the function, the conditional logic checks the value against the aforementioned regular expression.  And, like the text input validation function above, this one also returns a ‘y’ or ‘n’ value telling us whether or not the value is valid.  Here’s what our email validation function will look like:

function validateEmail($str) {
   if (!eregi("^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$", $str)) {
      $lValid = 'n';
   } else {
      $lValid = 'y';
   }
   return $lValid;
}

Step 3: Add PHP Function for Overall Form Validation

Now that we have set up the individual form field validation functions, we’ll need a master function that will be called when the user clicks the Submit button.  It will validate all of our fields, and will hold logic to either show an error or send the form.  Here’s what the function will look like.  An explanation of the function is below the function.

function validateForm() {
   $default_error = "There was a problem with your entry. Please correct the following fields.";
   $error = "";

   // Set up global variables to check
   global $user_name;
   global $user_email;
   global $user_message;

   // Perform validation for fields
   $valid_user_name = validateTextInput($user_name, 1);
   $valid_user_email = validateEmail($user_email);
   $valid_user_message = validateTextInput($user_message, 5);

   if ($valid_user_name != 'y') {
      $error .= "<li>Your Name</li>";
   }
   if ($valid_user_email != 'y') {
      $error .= "<li>Your Email</li>";
   }
   if ($valid_user_message != 'y') {
      $error .= "<li>Message</li>";
   }

   // Return error value or send form
   if ($error) {
      echo "<div class=\"error\">";
      echo "<label>" . $default_error . "</label>";
      echo "<ul>";
      echo $error;
      echo "</ul>";
      echo "</div>";
   } else {
      sendForm();
   }
}

First, the function will have two variables: $default_error and $error.  As you noticed, the $default_error has the general text calling out that there’s an error, and the $error variable is blank by default.

Next, we set up the global variables that we need to check.

Third, we set up a unique variable that will be set to the return value of our individual field validation functions.  After these variables are set up, we put in conditional logic that appends the $error variable with <li> tags if the variable isn’t set to ‘y’.

Finally, there is conditional logic that checks the $error variable.  If this variable is set to anything other than its default blank value, we echo out some HTML markup that writes out our $default_error message, and then lists out each individual form field that is invalid.  If the variable is still blank, we call the sendForm() function (not included in this article – you can write that out depending on the needs of your project).

Step 4: Add Markup and Logic for Submit and Reset Button Actions

Now that we have everything set up, we obviously need to be able to call our validation and reset functions, based on what button the user clicks.  I am a fan of putting this logic inside of a <div> tag at the top of the form.  Since the validation function echos out a message if invalid, it will thus echo out to a div tag that we can style however we want.  Same with the reset logic, as we will first display a “are you sure you want to reset?” message with a ‘Yes’ and ‘No’ button.  Here’s the markup we’ll insert for this logic, that we’ll place between the opening <form> tag and the first <label>.

<!-- Error Message -->
<div id="error-message">
   <?php
   if ($_POST["submit"]) {
      setVariables();
      validateForm();
   }
   ?>
</div>

<!-- Reset Confirmation Message -->
<div id="confirm-reset">
   <?php
   if (isset($_POST['reset'])) {
      setVariables();
      echo "<div class=\"confirm\">";
      echo "<label>Are you sure you want to reset?</label>";
      echo "<div class=\"hidden\"><br /></div>";
      echo "<input type=\"submit\" class=\"button\" name=\"reset-yes\" value=\"Yes\" />";
      echo "<div style=\"display:inline; width:16px;\">&nbsp;&nbsp;</div>";
      echo "<input type=\"submit\" class=\"button\" name=\"reset-no\" value=\"No\" />";
      echo "</div>";
   } else if (isset($_POST['reset-no'])) {
      setVariables();
   } else if (isset($_POST['reset-yes'])) {
      resetVariables();
   }
   ?>
</div>

As you see, the error message <div> tag has conditional logic that checks for $_POST["submit"].  If our submit button is clicked, the two functions inside this conditional statement are fired off.  First, we call the setVariables() function, which as outlined above, sets all of our global PHP variables to the value of the form fields.  After we have called this function, we call our validateForm() function that validates each field and checks whether to display an error message or send the form.

The reset <div> tag is a bit more detailed.  Our form ‘Reset’ button is set up with name ‘reset’, which is equivalent to $_POST['reset'].  This is the first check of our conditional logic here, which calls the setVariables(), and echos out a <div> tag with the reset confirmation message and accompanying ‘Yes’ and ‘No’ buttons.

The second and third checks of the reset conditional logic check for the ‘Yes’ and ‘No’ button clicks.  If the ‘No’ button is clicked, we simply call the setVariables() function.  If the ‘Yes’ button is clicked, we call the resetVariables() function which as outlined above, resets all variables and therefore erases the form field values.

Wrapping It Up

As I mentioned at the beginning of the article, this is useful because all of the logic is done with PHP, and can thus be used on any browser and device, regardless of how the settings are configured.  What I like to do is to put all of the logic in its own file, and then include it in the page wherever I need it.  That way, if I have a completely separate set of files for full web vs. mobile, for instance, I can still use the same one file that contains the form, and style it with CSS depending on what version of the site the user is seeing.

Also, at this point, feel free to add in your own CSS and/or other HTML markup for how the form is set up and will be displayed.

Also, since there’s A LOT of code and logic here, I have gone ahead and packaged up the files in a zip file that you can download for your convenience.  The zip file includes some sample CSS styles that I have set up to customize the look of the form.

Until next time, happy coding!

]]> http://www.hesslerdesign.com/blog/tutorials/bulletproof-your-online-forms-for-mobile-devices-with-php-%e2%80%93-part-2/feed/ 3 Bulletproof Your Online Forms for Mobile Devices with PHP – Part 1 http://www.hesslerdesign.com/blog/tutorials/bulletproof-your-online-forms-for-mobile-devices-with-php-part-1/ http://www.hesslerdesign.com/blog/tutorials/bulletproof-your-online-forms-for-mobile-devices-with-php-part-1/#comments Tue, 03 Aug 2010 16:09:28 +0000 Anthony http://www.hesslerdesign.com/blog/?p=541 The more popular mobile devices get, the more reason there is to be cautious and deliberate when creating your website. While there are a bevy of issues in dealing with creating mobile-friendly sites, the one I’d like to focus on here is building out an HTML form. More specifically, since some mobile devices don’t have JavaScript enabled (either by default or by choosing, either way done to increase speed on your device), it’s not necessarily good to rely on JavaScript validation for your forms. And, since most current mobile devices aren’t Flash-friendly either (thank you Steve Jobs), the best method in creating a form is using HTML, styled with CSS, and using PHP for validation and processing.

With that said, here’s part 1 of how to build a bulletproof form using only HTML, PHP and CSS.

Step 1: Plan Your Form

This first step is important when building out a form.  Rather than just jumping in and starting to throw together a form, it’s helpful (and a big time-saver) to plan out what fields your form will have, and what types of fields they will be.  I find it helpful to either jot this info down on a piece of paper, or write it in pseudo-code inside of a comment block in my working file.  Either way, plan your form fields first.  It will make life much easier as you build out the form, and eventually its validation and processing.

For this tutorial, we’ll build out a form with three fields: Name, Email, and Message.  The form will also have a Submit and Reset button for form processing and resetting.

Step 2: Create PHP Variables for Each Form Field Value

Now that we have the form architecture figured out, we need to assign a PHP variable to each form field.  In our example, this means we’ll need 3 variables.  So at the very top of our file, inside of the PHP wrapper tags (<?php ?>), create a variable for each.  In our example, it will look like this:

<?php
$user_name = "";
$user_email = "";
$user_message = "";
?>

Note: This step could be swapped with step #3 below, but for the sake of brevity in this tutorial, I’m putting it here so we can plug these variable values directly in the form fields when we build out the form in step #3.

Step 3: Build Out the Form

This step is simple, as we just need to put together the pure HTML code for our form.  Our form will have two input fields and one textarea (for the message).  While assembling the code, I’m going to insert some extra <div> and <span> tags that are inserted to break up the form into containers in the absence of CSS.  This is done as a precaution for mobile devices that are not set up to enable CSS.  Many times the default is okay, but I’ve noticed that here and there, you need to hammer it down a little bit.

Another important thing that we’ll do here is to set the value of each form field to its accompanying PHP variable.  This is a setup step that will ensure that our form will “remember” its values, should any of the form fields fail in the validation process (still to come).  You know what I mean here – we’ve all been there – you fill out a long form, submit, and find out that the form is somehow invalid, and all of the form fields are blank again, forcing you to refill the entire thing all over again.  Frustrating, isn’t it?

This is actually much easier than you might think using PHP.  For the input fields, it’s a simple matter of echoing out the PHP variable inside of the ‘value’ attribute of the tag.  For the textarea, you’ll need to echo out the PHP variable between the opening and closing tags.  And don’t worry – since our PHP variables are set as empty strings by default, the fields will also be empty when the form initially loads.  But as the form and validation logic get built out, our PHP variables are set to match the form fields, and thus the form fields will be populated with the “remembered” value of the field (stored in the variables) rather than being blank.

In our example, our form looks a little something like this:

<form action="" method="post" name="contact_form" id="contact_form">
   <div>
      <label for="user_name">Your Name:</label>
         <span class="hidden"><br /></span>
      <input type="text" name="user_name" value="<?php echo $user_name; ?>" autocomplete="off" tabindex="1" />
   </div>
   <div>
      <label for="user_email">Your Email:</label>
         <span class="hidden"><br /></span>
      <input type="text" name="user_email" value="<?php echo $user_email; ?>" autocomplete="off" tabindex="2" />
   </div>
   <div>
      <label for="user_message">Message:</label>
         <span class="hidden"><br /></span>
      <textarea name="user_message" autocomplete="off" wrap="physical" tabindex="3"><?php echo $user_message; ?></textarea>
   </div>
   <div class="centered">
      <input type="submit" name="submit" value="Submit &raquo;" />
      <input type="submit" name="reset" value="Reset Form" />
   </div>
</form>

A few important notes about the form setup:

  • We didn’t include any value in the action attribute for the form tag.  This is because we’re going to house all of the form logic within the same file to reduce page-to-page navigation, and the amount of external files we need to concern ourselves with.  There are different schools of thought about this, but this is the method we’ll use for this tutorial.
  • As discussed above, PHP markup has been inserted into the form fields as their values.
  • Each form field tag has a unique name.  This will be necessary when we start to set/reset variables and validate the form later on down the road.
  • Each form field is set up here with the autocomplete attribute set to “off”. This is just more of a security precaution that I like on contact forms, that makes it so the browser doesn’t remember previous values you’ve typed in other forms, in the case that you’re using a public computer that doesn’t delete private browsing history.  (Note: This doesn’t have anything to do with the method we’re using to echo out our PHP variables into the form, as our PHP variable method will simply keep our values in the form upon unsuccessful form submission, whereas the autocomplete attribute would have a dropdown of “remembered” values of past forms when the user starts typing.)
  • Overall, I’ve included a number of ids and classes in the form that will be later used to style it with CSS for browsers and mobile devices that have CSS enabled.

What’s Next

We now have the framework for our form, and have set up some of the initial PHP logic to help us populate and store form values.  In the next segment, we’ll work on adding in the variable setting/resetting functionality, as well as the validation functions.  Also, and most importantly, we’ll tie in the Submit and Reset buttons with the correct functionality to make the form do what it’s supposed to do.

Until the next part of this tutorial, happy coding!

]]> http://www.hesslerdesign.com/blog/tutorials/bulletproof-your-online-forms-for-mobile-devices-with-php-part-1/feed/ 0 Look Mom, No Flash! http://www.hesslerdesign.com/blog/web-design/look-mom-no-flash/ http://www.hesslerdesign.com/blog/web-design/look-mom-no-flash/#comments Fri, 25 Jun 2010 18:27:02 +0000 Anthony http://www.hesslerdesign.com/blog/?p=500 Whew!  It’s been far too long since my last ramblings on the blog here.  And c’mon…what’s up with that title?  No Flash?  Don’t worry, I’m not turning anti-Flash like Steve Jobs or anything.  Heck, I continue to do a ton of Flash development work, and seriously enjoy doing it.  No, it’s nothing like that.  It’s just that I’ve just launched an updated version of HesslerDesign.com that includes no Flash elements in the main framework of the site (minus the a few entries in the Work section, and of course excluding the blog section, because I write about Flash quite a bit as you can probably tell).

Why, you ask?

As time goes on, I’m finding myself drawing closer and closer to sticking close to pure HTML/CSS code, with other standards-compliant languages like PHP/MySQL and JavaScript.  Not to say Flash and it’s programming language (ActionScript) isn’t compliant with anything.  I had simply found myself doing things in Flash by default because it’s what I was most comfortable with, and could do with the least amount of technical issues.

But, now that I’ve been exploring more uses for JavaScript in place of what would normally be Flash code, it’s easier and easier to pull myself away from Flash.  Plus, as I’ve been doing more and more dynamic code content with PHP, I’m finding myself a lot more excited about using PHP than I am about using Flash.  I still enjoy Flash, and don’t get me wrong — there are definitely times and places for Flash.  But for where I’m at now, I am finding that my own site doesn’t currently need to rely on Flash so much.

Outside of the programming techniques used for the most recent release of the site, I felt like it was definitely the time for a change regarding the design of the site.  The new design has a much more sophisticated simplicity and clean look than the old version. It’s focus is more on the projects and artwork, as they take a very prominent position on the Work page with only the project details to accompany them.  No fluff content just to fill in space and give users something else to read.  Only the necessities.

With that all said, I hope you enjoy the newest iteration of HesslerDesign.com.  If you haven’t already, check out the Work page, which has a few new projects listed that I’ve completed recently.  I hope you like what you see.

Until next time, happy coding!

]]> http://www.hesslerdesign.com/blog/web-design/look-mom-no-flash/feed/ 0 Making Your WordPress Menu Items Smarter http://www.hesslerdesign.com/blog/tutorials/making-your-wordpress-menu-items-smarter/ http://www.hesslerdesign.com/blog/tutorials/making-your-wordpress-menu-items-smarter/#comments Wed, 16 Dec 2009 19:20:55 +0000 Anthony http://www.hesslerdesign.com/blog/?p=270 In my current work with designing my custom WordPress theme for this blog, I came up with a few nifty little tricks to make the theme smarter. One particular thing I found tricky was how to make the top nav (or any nav, for that matter) menu items smart enough to be classified as “active” if the user was on a page in a given section. My answer came in a nice little solution called Page Templates, and a built-in function called is_page_template().

Step 1: Create a New Page Template

If you’re familiar with WordPress, you may know that you can create Page Templates that differ from the “index.php” page template. All you need to do when creating a new Page Template is save your new file as a unique file name (with a few exceptions) in your Theme directory, and put the following code at the top of the file:

<?php
/*
Template Name: My Cool Template
*/
?>

This little snippet of code defines your file as “My Cool Template”, or whatever template name you give it. There’s plenty more about making Page Templates at the WordPress Codex, in the Pages section.

Step 2: Assign a Page Template to a Page

Once you’ve got your page templates set up, you can assign a specific page template to one of your pages in the ‘Pages’ section of your WordPress Admin. All that you need to do is get into ‘Edit’ mode for a page, then in the ‘Attributes’ section on the right, select your template under the ‘Template’ section. It’s that easy. (If you want more info on different page attributes that can be set, check out WordPress Support for Page Attributes.)

Step 3: Update the Menu List Items

Once the page templates have been set up, it’s time to set up the top nav list items to be smart enough to be classified  as “active” if the page being viewed is an instance of that page template.

(Note: When I was creating my custom template, I hard-coded my nav links because I knew exactly what links I wanted to have, and because I wasn’t interested in my theme being shared and used by others. With that said, the logic below may need to be edited if used for a template whose navigation is built dynamically.)

In the code where the navigation items are built, I initially had the following syntax used for each menu item:

<li><a href="<?php bloginfo('url'); ?>/mysection/">My Section</a></li>

This is your standard menu list item syntax for a menu item that’s hard-coded. It’s smart to use the bloginfo('url') function inside of the href to get the URL of your blog, and then append any additional directories to the end (if needed). This way, if you switch URLs, or do end up sharing the theme with others, it won’t be hard-coded to just one URL. But each <li> tag needs to have the ability to be appended with class="active" if the page being viewed is on a page with a given page template. For that, we need to add in another function (is_page_template()), and wrap it inside of a conditional statement:

<li <?php if(is_page_template('my_cool_template.php')) : ?> class="active" <?php endif; ?>><a href="<?php bloginfo('url'); ?>/mysection/">My Section</a></li>
In the code above, we added the PHP logic:
<?php if (is_page_template('my_cool_template.php')) : ?> <?php endif; ?>
And then, between the blocks of PHP code, we add the ‘active’ class to assign to the list item:
class="active"

The is_page_template() function checks the page against the file name of the template passed into it. When used inside a conditional statement, it will return a true or false value, depending on whether or not the page being viewed uses that template. And after applying this “active” logic to our list items, and as long as the CSS file has a style for linked list items classified as active (i.e. li.active a), any list item whose conditional statement returns a true will have the ‘active’ class assigned to it.

That’s a Wrap

So there you have it. A simple bit of conditional logic (assuming you’re decently familiar with PHP) that you can put into your menu list items so the links can be classified according to the page being viewed. Until next time, happy coding!

]]> http://www.hesslerdesign.com/blog/tutorials/making-your-wordpress-menu-items-smarter/feed/ 0 Sending Flash Data to ASPX or PHP files http://www.hesslerdesign.com/blog/flash/sending-flash-data-to-aspx-or-php-files/ http://www.hesslerdesign.com/blog/flash/sending-flash-data-to-aspx-or-php-files/#comments Wed, 17 Jun 2009 15:54:25 +0000 Anthony http://www.hesslerdesign.com/blog/?p=1 If you are working on any Flash website projects that need to pass data out to an ASPX or PHP file (or any other type of file requiring to send data via POST or GET), you can use the code below.  Note that this code is written in ActionScript 3.

/* --- Begin Code --- */
var firstName:String = "Anthony";

function submitForm(e:MouseEvent):void {
   var varsToSend:URLVariables = new URLVariables();
   varsToSend.firstName = firstName;
   // Insert additional values to send

   // Create URL Request, set to POST, and attach data
   var formRequest:URLRequest = new URLRequest("flash.php");
   formRequest.method = URLRequestMethod.POST;
   formRequest.data = varsToSend;

   // Create URL Loader, attach listeners, and load URL Request
   var varLoader:URLLoader = new URLLoader;
   varLoader.addEventListener(Event.COMPLETE, onLoaded);
   varLoader.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler);
   varLoader.load(formRequest);
}

function onLoaded(e:Event):void {
   // Insert success actions here
}

function ioErrorHandler(e:IOErrorEvent):void {
   // Insert error actions here
}
/* --- End Code --- */

A few notes on the code:

  • The submitForm function in this example is called on a MouseEvent.CLICK event (noted with the e:MouseEvent passed into the function).
  • If you need to send via GET, change the URLRequestMethod to URLRequestMethod.GET.
  • One thing I noticed about the URLRequest was that on the particular domain I was working on, using an absolute URL gave me some bugs.  If I used http://www.myfakedomain.com/flash.aspx, my tests failed on PCs but worked on Macs.  If I removed the “www”, resulting in http://myfakedomain.com/flash.aspx, my tests failed on Macs, but worked on PCs. I don’t know if this was an issue with how the domain was set up (since I only worked on the Flash portion, not setting up the domain) or if it is a Flash URLRequest bug.  Either way, I found that using a relative URL (“flash.aspx”) worked on Macs and PCs, and didn’t throw me any errors.

Hope this sheds some insight on how to send data out of Flash.  Happy coding!

]]> http://www.hesslerdesign.com/blog/flash/sending-flash-data-to-aspx-or-php-files/feed/ 2