INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

Object Referencing

Using brackets as an alternative to dot notation and eval() by adam0101
Posted: 8 Jul 03 (Edited 20 Sep 05)

Most times you can get a reference to an object using document.getElementById("myID"). However, there are certain situations where an alternate method is required. For example, if there is no ID because the object you are trying to retrieve isn't an HTML element and perhaps the name of the object isn't known until run-time.

If the object name is known at design-time, you can easily refer to the object using dot notation. Dot notation is a way to traverse the Document Object Model (DOM) to find the object you're looking for. For example:

CODE

document.formName.fieldName.value
What you may not be aware of is that you can also refer to objects like you would with an associative array:

CODE

document.formName["fieldName"].value
Or:

CODE

document["formName"]["fieldName"].value
Or even:

CODE

document.formName[variableName].value
This is useful if your field name has spaces or dots in it. It's also good if you work with PHP which requires you to name your multiple select fields like "fieldName[]":

CODE

document.formName["fieldName[]"].value
It also gives you a way to refer to variable names that may be dynamically generated so you don't have to use eval() which is a huge resource hog. For example, if you had 10 fields named field0, field1, field2, etc... you could use a loop in the following manner:

CODE

for(var i=0;i<10;i++){
  document.formName["field"+i].value='New Value';
}
Creating a variable with a dynamic name is also easy:

CODE

window["my"+"Dyn"+"Var"]="This string is in the variable 'myDynVar'.";
Here's an example of this in use. This script turns all querystring parameters into window variables:

CODE

var p=location.search.substring(1).replace(/\+/g,' ').split("&");
for(var i=0;i<p.length;i++){
  v=p[i].split("=");
  window[unescape(v[0])]=unescape(v[1])
}
Here's another example that uses this technique to refer to properties of a custom object. This script will sort an array of custom objects based on one of the properties of those objects:

CODE

<script>
function CD(band,album,year,genre) {
    this.band  = band
    this.album = album
    this.year  = year
    this.genre = genre
}
function mySort(a,b){
  if(a[SortBy] > b[SortBy]){return 1}
  if(a[SortBy] < b[SortBy]){return -1}
  return 0
}

var myCDs = new Array();
myCDs[0] = new CD("Metallica","And justice for all","1988","Metal")
myCDs[1] = new CD("Sepultura","Arise","1991","Trash")
myCDs[2] = new CD("Black Sabbath","Master of Reality","1976","Hard Rock")

var SortBy = "band" //change this to the column you want to sort on.
myCDs.sort(mySort)
</script>
Finally, you can use this technique to dynamically refer to a function:

CODE

var fncName="myFunctionName";
window[fncName]()

Basically, any object that represents a collection of properties or objects can use this method if dot notation is not an option. For example, images can be referred to using this:

CODE

var img = document.images[myImgVar]

I hope this helps!

Adam
http://adameslinger.blogspot.com//

Back to Javascript FAQ Index
Back to Javascript Forum

My Archive

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close