...

View Full Version : dynamic variable name how to



larsof54
11-10-2010, 07:06 PM
I am trying to concatenate text to refer to a variable:


var HomePlayer1Points = 17
var i = 1
var a = "HomePlayer"
var b = "Points"
var c = a + i + b

alert(c.value)


it give me undefined instead of 17. How should this be done without using eval() ???

Philip M
11-10-2010, 07:11 PM
var HomePlayer1Points = 17;
var a = "HomePlayer";
var b = " Points";
var c = a + HomePlayer1Points + b;

alert(c); // NOT c.value


All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

larsof54
11-10-2010, 07:16 PM
i tried alert(c) but it gives me "HomePlayer1Points"

what I want to get is the contents of HomePlayer1Points which is 17

Kor
11-10-2010, 07:24 PM
<script type="text/javascript">
var HomePlayer1Points = 17
var i = 1
var a = "HomePlayer"
var b = "Points";
var c=a+i+b;
alert(window[c])
</script>

But only if the variable HomePlayer1Points is a global variable (as it belongs to the Global Object window). Is this what you want?

larsof54
11-10-2010, 07:28 PM
well...
considering that there are no functions being used it is global

Philip M
11-10-2010, 07:30 PM
i tried alert(c) but it gives me "HomePlayer1Points"

what I want to get is the contents of HomePlayer1Points which is 17

The code I gave you works perfectly. It yields HomePlayer 17 points
Is that not what you want? You must have put HomePlayer1Points in quotes, making it a literal.

That is one reason why it is good practice to name your variables with fairly short but recognisable names.
Example: HP1Pts.

Or if you simply want the value 17 to show, then it is as simple as


var HomePlayer1Points = 17;
alert(HomePlayer1Points);

Kor
11-10-2010, 07:32 PM
All the Globals (including the Global set functions) are properties of the window object, and they can be treated as such. Here's a more eloquent version:


<script type="text/javascript">
var HomePlayer1Points = 17
var i = 1
var a = "HomePlayer"
var b = "Points";
alert(window[a+i+b])
</script>

Kor
11-10-2010, 07:37 PM
Or even clearer:


<script type="text/javascript">
var HomePlayer1Points = 17; //global variable
function test(){
var i = 1; // local
var a = "HomePlayer"; //local
var b = "Points"; //local
alert(window[a+i+b]);
}
test()
</script>

Philip M
11-10-2010, 07:41 PM
alert(window[c])

So how is that better or simpler than


var HomePlayer1Points = 17;
alert(HomePlayer1Points);

:confused:

Kor
11-10-2010, 07:58 PM
So how is that better or simpler than


var HomePlayer1Points = 17;
alert(HomePlayer1Points);

:confused:
It's a simple matter of finding/creating/destroying dynamically a global something. A it is, the OP's example is a pure academical one. But it becomes interesting when you want to create or handle on-the-fly that object/function:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
onload=function(){
window['test']=function(){alert('foo')}
}
</script>
</head>
<body>
<div onclick="test()">click me</div>
</body>
</html>

It's just a matter of dynamical creating/finding/handling a Global, which is useful in many applications.

larsof54
11-10-2010, 10:51 PM
Thank you Kor or your solution. That is exactly what I need to create dynamic references to variables. I have another similar question however:

How can I reference form elements the same way?

For example I have an input text field element by the name of HP1R1points. I would like to construct the reference to it the same way as the original question, ie. by concatenating strings and numbers.

I tried alert(window["HP" + 1 " "R" + 1 + "points"]) but it results in a Javascript message of: [object HTMLInputElement]

Old Pedant
11-11-2010, 12:51 AM
document.forms[0]["HP"+1+"R" + 1 + "points"]

larsof54
11-11-2010, 01:08 AM
still not working:



alert(document.forms[0]["HP" + 1 + "R" + 1 + "points"])


results in: [object HTMLInputElement]

Old Pedant
11-11-2010, 01:22 AM
Yes??? That's what it *SHOULD* be.

A *REFERENCE* to an *OBJECT*.

What do you want to *DO* with it???



var formField = document.forms[0]["HP" + 1 + "R" + 1 + "points"];
var value = formField.value; // you want to get its value?
if ( isNaN( parseInt( value ) )
{
formField.style.backgroundColor = "pink"; // you want to change its style?
formField.value = "Try again"; // change its value?
}
... and so on...

How can I guess what you wanted to do with it after you got the reference?

Old Pedant
11-11-2010, 01:24 AM
Note that window["HP" + 1 " "R" + 1 + "points"] may or may not get you a FORM FIELD. Probably won't in any browser except MSIE 8 and below.

larsof54
11-11-2010, 01:39 AM
I want to be able to get itís value

rnd me
11-11-2010, 02:04 AM
use more evals and dom-0 syntax...

Old Pedant
11-11-2010, 02:19 AM
I want to be able to get itís value

And how did I *not* show you that?

I quote my own code:

var formField = document.forms[0]["HP" + 1 + "R" + 1 + "points"];
var value = formField.value; // you want to get its value?

Of course you can do it all in one step:

var val = document.forms[0]["HP" + 1 + "R" + 1 + "points"].value;

But that's no different than any other object reference in JavaScript...or most any other language, for that matter.

Kor
11-11-2010, 09:35 AM
Lets make things clear.

When a variable is assigned as a primitive, its value is a primitive value ant it is stored directly in the location that the variable accesses. Primitives are pseudo-objects.


var myNumber=5;
alert(myNumber); // returns the primitive value: 5

But when a variable is assigned as an object's reference, its value is a reference value:


var myObject={};
alert(myObject); // returns the reference value: [object Object]


Don't confound the primitive or reference value with the property value of some HTML DOM elements


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
onload=function(){
var myTextBox=document.forms[0].txt;
alert(myTextBox); // returns the reference value: [object HTMLInputElement]
alert(myTextBox.value); // returns the value of the property/attribute value: foo
}
</script>
</head>
<body>
<form action="">
<input type="text" name="txt" value="foo">
</form>
</body>
</html>

james720
11-11-2010, 11:45 AM
i tried alert(c) but it gives me "HomePlayer1Points"

what I want to get is the contents of HomePlayer1Points which is 17

Philip M
11-11-2010, 11:54 AM
i tried alert(c) but it gives me "HomePlayer1Points"

what I want to get is the contents of HomePlayer1Points which is 17

We seem to be going round in circles. :(

One more time:-


<script type = "text/javascript">

var HomePlayer1Points = 17;
var a = "HomePlayer";
var b = " Points";
var c = a + HomePlayer1Points + b;

alert(c); // NOT c.value

</script>

The result is HomePlayer 17 Points.
If that is not what you want what do you want?

Kor
11-11-2010, 12:27 PM
We seem to be going round in circles. :(

One more time:-


<script type = "text/javascript">

var HomePlayer1Points = 17;
var a = "HomePlayer";
var b = " Points";
var c = a + HomePlayer1Points + b;

alert(c); // NOT c.value

</script>

The result is HomePlayer 17 Points.
If that is not what you want what do you want?

I think you are making some circles as well. Have you tested your own code? :D

Sound be


<script type="text/javascript">
var HomePlayer1Points = 17;
var a = "HomePlayer";
var b = "Points";
var c = a + 1 + b;
alert(window[c]);
</script>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum