spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / web / dev / menus / oneformv2 To page 1current pageTo page 3To page 4To page 5To page 6
[previous] [next]

URPM: Single Form Version II

Developer News
Mandrake Linux Founder Back, Virtually
Amazon: We're a Technology Company
Sun Expands MySQL With Closed Source

Part 1: The JavaScript Code

The first incarnation of the single form URPM did not keep track of menu values because my client only stored the text property. Since then, many people I heard from expressed their need to have the code sent to the server, rather than the description. To add the codes to the arrays, I stored literal arrays within each array element - in effect creating a 2 dimensional array. Most people familiar with JavaScript are use to defining arrays with a constructor - e.g.: var a = new Array() or Array( "dog", "cat", 4, 56.43 ). What is less commonly known, is that we can also create an array literal by enclosing the elements with square brackets ( [] ). Literal values are the ones you type directly into mathematical or string expressions, as opposed to data which is stored in a variable. For example 23 (an integer), 12.32E23 (a floating point), or 'flopsy the Hamster' (a string) are all examples of literals. More complicated data types such as Regular Expressions and Arrays also support literals.

With respect to Objects, literals are a great time saver by allowing the programmer to create the Object and assign a value to it simultaneously. Whether you're defining a string or an Array of strings, unless you're waiting for some kind of special occasion, you should assign its data at the same time if you already know the value(s). To illustrate, let's say that I want to assign a name to a string for safe keeping. I would write the following line:

var name = "Fred";

I could do the same using the String constructor:

var name = new String("Fred");

Both are identical in terms of function, but the first is shorter. Similarly, if you wanted to assign the values of an array right away, there would be no real reason to go through the constructor (that is, unless you like typing). You would just assign them like so:

var a = [ "Fred", "Joe", "Mary" ]; 
// same as new Array("Fred", "Joe", "Mary");

WARNING: Array literals are not supported by really old browsers such as Netscape and IE 3 or below. If you want to make everyone happy, use the constructor.

There are many times that you will want to assign the array elements one at a time because you don't how many or what kind of data types will be coming your way. Since I knew in advance exactly what I needed to store, I opted to use the more succinct array literal over the longer Array constuctor. I stored the text in the first element, and the value in the second one. Here is a comparison of the old and the new arrays:

Legend:
blue text: JavaScript
green text: modified code

OLD ARRAY:

//an empty array that will hold the final Objects.
var m            = new Array();
var manufacturer = new Array(); //list 1
var model        = new Array(); //list 2
var level        = new Array(); //list 3


 manufacturer[0]="ACURA";
  model[0]="CL";
   level[0]="2.2 PREMIUM";
   level[1]="2.3";
   level[2]="3.0";
   level[3]="";
  model[1]="EL";
   level[4]="PREMIUM";
   level[5]="SE";
   level[6]="SPORT";
   level[7]="";
  model[2]="INTEGRA";
   level[8]="GS";
   level[9]="GS-R";
   level[10]="LS";
   level[11]="RS";
   level[12]="SE";
   level[13]="TYPE-R";
   level[14]="";
  model[3]="";
 manufacturer[1]="ALFA ROMEO";
  model[4]="SEDAN LS";
   level[31]="LEVEL N/A";
   level[32]="";
  model[5]="SPIDER";
   level[33]="LEVEL N/A";
   level[34]="VELOCE";
   level[35]="";
  model[6]="";
  ...

NEW ARRAY:

//an empty array that will hold the final Objects.
var m            = new Array();
var manufacturer = new Array(); //list 1
var model        = new Array(); //list 2
var level        = new Array(); //list 3


 manufacturer[0]=["ACURA", "ACU"];
  model[0]="CL";   //no value
   level[0]=["2.2 PREMIUM", "2.2"];
   level[1]="2.3";
   level[2]="3.0";
   level[3]=[];    //"" still works too
  model[1]="EL";
   level[4]=["PREMIUM", "PRE"];
   level[5]="SE";
   level[6]=["SPORT", "SP"];
   level[7]=[];
  model[2]=["INTEGRA", "INT"];
   level[8]="GS";
   level[9]=["GS-R", "GRS"];
   level[10]="LS";
   level[11]="RS";
   level[12]="SE";
   level[13]=["TYPE-R", "TYR"];
   level[14]=[];
  model[3]=[];
 manufacturer[1]=["ALFA ROMEO", "AR"];
  model[4]=["SEDAN LS", "SLS"];
   level[31]=["LEVEL N/A", "NA"];
   level[32]=[];
  model[5]=["SPIDER", "SPI"];
   level[33]=["LEVEL N/A", "NA"];
   level[34]=["VELOCE", "VEL"];
   level[35]=[];
  model[6]=[];
  ...

My goal was to make adding the value property as easy as possible, so I only added values where the text is not the same. If it is, the script will not assign a value to the listbox, which will ultimately lead to the Web page sending the text property to the server instead. Since they are the same, it will make no difference from the database's point of view. Whether or not you need to always have a value will depend on what kind of text you are displaying in your lists, and what you plan on doing with the listboxes. Either way, both these arrays will work with the new code.


home / web / dev / menus / oneformv2 To page 1current pageTo page 3To page 4To page 5To page 6
[previous] [next]

Written by Robert Gravelle and

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

Whitepapers and eBooks

Intel Whitepaper: Comparing Two- and Four-Socket Platforms for Server Virtualization
IBM Solutions Brief: Go Green With IBM System xTM And Intel
HP eBook: Simplifying SQL Server Management
IBM Contest: Are You the Next Superstar? Join the "Search for the XML Superstar" Contest to Find Out
Microsoft PDF: Top 10 Reasons to Move to Server Virtualization with Hyper-V
Microsoft PDF: Six Reasons Why Microsoft's Hyper-V Will Overtake Vmware
Microsoft Step-by-Step Guide: Hyper-V and Failover Clustering
Intel PDF: Quad-Core Impacts More Than the Data Center
Intel PDF: Virtualization Delivers Data Center Efficiency
Go Parallel Article: PDC 2008 in Review
Microsoft PDF: Top 11 Reasons to Upgrade to Windows Server 2008
Avaya Article: Communication-Enabled Mashups: Empowering Both Business Owners and IT
Intel Whitepaper: Building a Real-World Model to Assess Virtualization Platforms
  PDF: Intel Centrino Duo Processor Technology with Intel Core2 Duo Processor
Microsoft Article: Build and Run Virtual Machines with Hyper-V Server 2008
Go Parallel Article: Q&A with a TBB Junkie
IBM Whitepaper: Innovative Collaboration to Advance Your Business
Internet.com eBook: Real Life Rails
IBM eBook: The Pros and Cons of Outsourcing
Internet.com eBook: Best Practices for Developing a Web Site
IBM CXO Whitepaper: The 2008 Global CEO Study "The Enterprise of the Future"
Avaya Article: Call Control XML in Action - A CCXML Auto Attendant
IBM CXO Whitepaper: Unlocking the DNA of the Adaptable Workforce--The Global Human Capital Study 2008
Adobe Acrobat Connect Pro: Web Conferencing and eLearning Whitepapers
HP eBook: Guide to Storage Networking
MORE WHITEPAPERS, EBOOKS, AND ARTICLES
webref The latest from WebReference.com Browse >
Popular JavaScript Framework Libraries: An Overview - Part 3 · Accessing Your MySQL Database from the Web with PHP · Working with the DOM Stylesheets Collection
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Crucial Triples Up With New Three-Channel DDR3 Kits · Meet the Finalists: Excellence in Technology Awards · Tealeaf Offers Insight to Mobile Customer Behavior

Created: October 2, 2001
Revised: October 2, 2001


URL: http://webreference.com/dev/menus/oneformv2/2.html