Working with Events in Grid: Adding Hyperlink
Updated: Dec 31, 2007
Views: 1456
Description: This tutorial will show you how to add and use a mouse click event to call a function that sends a URL request to the url stored in the data field in the XML document.
The Complete Project:
Complete Code:
import flash.net.URLRequest;
import flash.net.navigateToURL;
import flash.events.MouseEvent;
import com.afcomponents.events.GridEvent;
// Handle item click
function onItemClick(event:MouseEvent) {
var url:URLRequest = new URLRequest(event.target.data);
navigateToURL(url, "_self");
}
// Wait for items to load from XML and then add MouseEvent.CLICK to each item
function onXMLLoaded(event:GridEvent) {
myGrid.addGenericItemEventListener(MouseEvent.CLICK, onItemClick);
}
myGrid.addEventListener(GridEvent.XML_LOAD_COMPLETE, onXMLLoaded);
import flash.net.navigateToURL;
import flash.events.MouseEvent;
import com.afcomponents.events.GridEvent;
// Handle item click
function onItemClick(event:MouseEvent) {
var url:URLRequest = new URLRequest(event.target.data);
navigateToURL(url, "_self");
}
// Wait for items to load from XML and then add MouseEvent.CLICK to each item
function onXMLLoaded(event:GridEvent) {
myGrid.addGenericItemEventListener(MouseEvent.CLICK, onItemClick);
}
myGrid.addEventListener(GridEvent.XML_LOAD_COMPLETE, onXMLLoaded);
Set-Up and Add Content Using through XML
Before you begin make sure that you have successfully installed the component inspector have been able to load content into the Grid component using XML. Also make sure that you give your Grid an instance name of myGrid.
Please make sure that you have added your target URL's into the data tag in your XML document for all your items.
Understanding the Plan for ActionScript
Once we have our Grid correctly loading all our items, it is time to get the items to act as hyperlinks and this is done by adding some action to an actions layer on the frame. Let's now discuss our plan for what we would like to accomplish with ActionScript.
- Our first thing we are going to want to do is add an event listener to watch when a item has been clicked on.
- We will want this event listener to call a function that sends a URL request to the target URL for the item in our XML document.
The first thing that we want to do is add an event listener for when the user clicks an item in the Grid. In order to add an event listener for the items in the Grid, we have to wait for the XML to load and we this with an event listener and a function that adds the mouse click event listener.
import flash.events.MouseEvent;
import com.afcomponents.events.GridEvent;
function onXMLLoaded(event:GridEvent) {
myGrid.addGenericItemEventListener(MouseEvent.CLICK, onItemClick);
}
myGrid.addEventListener(GridEvent.XML_LOAD_COMPLETE, onXMLLoaded);
import com.afcomponents.events.GridEvent;
function onXMLLoaded(event:GridEvent) {
myGrid.addGenericItemEventListener(MouseEvent.CLICK, onItemClick);
}
myGrid.addEventListener(GridEvent.XML_LOAD_COMPLETE, onXMLLoaded);
Function for URL Request
Now that we have added the event listener we need to write the function that we call that will send a URL request based
import flash.net.URLRequest;
import flash.net.navigateToURL;
function onItemClick(event:MouseEvent) {
//you can store the URL in "data" in your XML file
var url:URLRequest = new URLRequest(event.target.data);
navigateToURL(url, "_self");
}
import flash.net.navigateToURL;
function onItemClick(event:MouseEvent) {
//you can store the URL in "data" in your XML file
var url:URLRequest = new URLRequest(event.target.data);
navigateToURL(url, "_self");
}
