Home Projects Flash CS3 How to Create a Flash Searchable DataGrid in AS3 using XML from MS Access - Creating Inputs, Lists, and Labels





Forgot your password?
Forgot your username?
No Account Yet? Create an account

Like it? Share it!

Add to: JBookmarks Add to: Facebook Add to: Windows Live Add to: Ximmy Add to: Digg Add to: Del.icoi.us Add to: Reddit Add to: Jumptags Add to: Upchuckr Add to: StumbleUpon Add to: Slashdot Add to: Netscape Add to: Yahoo Add to: Blogmarks Add to: Diigo Add to: Technorati Information

How to Create a Flash Searchable DataGrid in AS3 using XML from MS Access
How to Create a Flash Searchable DataGrid in AS3 using XML from MS Access - Creating Inputs, Lists, and Labels PDF Print E-mail
User Rating: / 16
PoorBest 
Projects - Flash CS3
Written by drooza   
Tuesday, 07 October 2008 22:47
Article Index
How to Create a Flash Searchable DataGrid in AS3 using XML from MS Access
The ActionScript
Making the DataGrid
Loading the XML
The Exported XML File
Creating Inputs, Lists, and Labels
Array Filters (for DataProviders)
View the Example
All Pages

Creating Inputs, Lists, and Labels

All this code really does is instantiate labels, inputs, and lists, which could actually be drawn on the stage with less code, but I have already written the code.

 
 
//---------------------------
var textInput:TextInput = new TextInput();
textInput.move(10, 150);
textInput.width = 220;

//Press the enter key to apply filter (search)
textInput.addEventListener("enter",changeHandler);
//Everytime the input box is changed, apply filter (search)
//(can affect performance)
textInput.addEventListener(Event.CHANGE, changeHandler);

textInput.tabIndex = 0;
addChild(textInput);

var textInputLabel:Label = new Label();
textInputLabel.text = "Search grid";
textInputLabel.move(textInput.x + 5, textInput.y - 20);
textInputLabel.autoSize = TextFieldAutoSize.LEFT;
addChild(textInputLabel);

//---------------------------
var makeList:List = new List();
makeList.move(10,40);
makeList.width = 100;
makeList.rowCount = 4;
makeList.addEventListener(Event.CHANGE, changeHandler);
makeList.tabIndex = 1;
addChild(makeList);

var makeLabel:Label = new Label();
makeLabel.htmlText = "Make";
makeLabel.move(makeList.x + 5, makeList.y - 20);
makeLabel.autoSize = TextFieldAutoSize.LEFT;
makeList.tabIndex = 2;
addChild(makeLabel);

//---------------------------
var modelList:List = new List();
modelList.move(makeList.x + makeList.width + 10, 40);
modelList.width = 125;
modelList.rowCount = 4;
modelList.addEventListener(Event.CHANGE, changeHandler);
addChild(modelList);

var modelLabel:Label = new Label();
modelLabel.htmlText = "Model";
modelLabel.move(modelList.x + 5, modelList.y - 20);
modelLabel.autoSize = TextFieldAutoSize.LEFT;
addChild(modelLabel);

//---------------------------
var yearList:List = new List();
yearList.move(modelList.x + modelList.width + 10, 40);
yearList.width = 65;
yearList.rowCount = 4;
yearList.addEventListener(Event.CHANGE, changeHandler);
addChild(yearList);

var yearLabel:Label = new Label();
yearLabel.htmlText = "Year";
yearLabel.move(yearList.x + 5, yearList.y - 20);
yearLabel.autoSize = TextFieldAutoSize.LEFT;
addChild(yearLabel);

//---------------------------
var hpList:List = new List();
hpList.move(yearList.x + yearList.width + 10, 40);
hpList.width = 85;
hpList.rowCount = 3;
hpList.addEventListener(Event.CHANGE, changeHandler);
addChild(hpList);

var hpLabel:Label = new Label();
hpLabel.htmlText = "Horsepower";
hpLabel.move(hpList.x+5, hpList.y - 20);
hpLabel.autoSize = TextFieldAutoSize.LEFT;
addChild(hpLabel);

//---------------------------
var optionList:List = new List();
optionList.move(hpList.x + hpList.width + 10, 40);
optionList.width = 135;
optionList.rowCount = 4;
optionList.addEventListener(Event.CHANGE, changeHandler);
addChild(optionList);

var optionLabel:Label = new Label();
optionLabel.htmlText = "Options";
optionLabel.move(optionList.x + 5, optionList.y - 20);
optionLabel.autoSize = TextFieldAutoSize.LEFT;
addChild(optionLabel);

//---------------------------
 


Comments
Add New Search
Datagrid
Houndawg (67.49.2.xxx) 2009-01-12 18:51:52

Great Job.
This is exactly what I was looking for.

I hope it works for me like it
does in the example.

Question: How would you go about adding a image
and/or a movie to this example.
CellRenderer
drooza (SAdministrator) 2009-01-17 22:18:47

Use CellRenderer

http://www.sephiroth.it/tutorials/flashPHP/cell...
Errerem carnt read
Anonymous (82.42.145.xxx) 2009-02-05 08:28:30

this is just what I want but i carnt read how to do kt because am a starter in
the flash 8 fingy
dynamic grid...
renzo (125.163.76.xxx) 2009-03-15 01:35:32

does anyone know how to edit the value at grid...
how to play video when cell is clicked?
Jason (86.29.128.xxx) 2009-05-02 22:15:43

how would you make a video play in flash when a cell is clicked in the datagrid?
im guessing a function but would you know the exact code and where it gets
placed in the AS??

thanks
Anonymous (82.75.150.xxx) 2009-06-16 07:19:54

Is there a way to work with several xml-
files; here for instance one for
cars,
one for truck, one for motorbikes.

Depending on what the visitor is
looking
for, the data inside the xml-files in question should be read into
the
datagrid and the queries set for All.

The visitor can 'jump' between each
of
the sections (eg by using a combobox
and the grid gets filled up with the
new
data from the other xml-file
immediately.

I realy would like to have seperate

xml-files for each of the needs of
the visitor...

Thank you very much in
advance
change data provider
drooza (SAdministrator) 2009-06-18 19:24:09

What you can do is just change the dataprovider of the datagrid to another xml
file.

check out how it's filtered. since the dataprovider is changed to an
array for filtering, you can just filter a different dataprovider.
atul singh (61.16.244.xxx) 2009-07-02 00:09:56

very nice
thanks for lot of work

Regards
Atul singh
Anonymous (74.103.209.xxx) 2010-02-05 01:46:17

Nicely done.
I am trying to figure how can I insert URL and get it to work.
Question
James (95.17.50.xxx) 2010-03-14 07:57:02

Really top notch tutorial, congratulations. I'm trying to take it a bit further
but I need a bit of help. How can I use the filter to load a corresponding image
into a UIloader - I think the problem I'm having is that logically the image can
only appear when the user has filtered down to only one unique result in the
data grid, but I can't see what the value of the result would be in action
script, or what to set an event listener for.
then I suppose it is a simple
question of: -loader.source=that value+".png"
If you don't think this is
the way please tell me what you think
Thanks in advance and keep up the good
work - we need you!
Write comment
Name:
Email:
 
Title:
UBBCode:
[b] [i] [u] [url] [quote] [code] [img] 
 
:angry::0:confused::cheer:B)
:evil::silly::dry::lol::kiss:
:D:pinch::(:shock::X
:side::):P:unsure::woohoo:
:huh::whistle:;):s:!:
:?::idea::arrow:
Please input the anti-spam code that you can read in the image.

3.26 Copyright (C) 2008 Compojoom.com / Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved."

Last Updated ( Friday, 07 November 2008 12:00 )
 

Make a Donation!

Advertisement
Banner

HomeProjectsSnippetsContact Me

Copyright © 2008, Drooza.com