Create dynamic variables

Dynamic variables are variabiles that are not set with a specific name in script, their name is dynamically, it can be formed with a string-value from other source (for example from a form field, or other variabile).
JavaScript has not implemented especially dynamic variables (like PHP), but it can be used various methods to achieve the same result; to make a string to become the name, or part of the name, of a variabile.
So, in JavaScript can be used two methods: with "eval()", or with "window".
Here's an example with each method (explanations are in script code).

1- With eval()

<script type="text/javascript"><!--
// Sets a variable with a string-value
// The value of this variable will become the name of a dynamic variable
var vari1 = 'val';
// Now, "eval()" uses vari1`s value to create another variable, having this name
eval("var "+vari1+"= 'The value of dynamic variable, val';");
alert(val);         // Test if the "val" variable exists

// As part of the name
eval("var pre_"+vari1+"= 'Part of the name, pre_val';");         // the pre_val variable is set
alert(pre_val);                // test to see the value of pre_val
--></script>

- To see the reslt of this example, click:

2- With window

<script type="text/javascript"><!--
// Sets a variable with a string-value
// The value of this variable will become the name of a dynamic variable
var vari2 = 'val2';
// With "window" we use the value of "vari2" as key in Array
// The key of the "window" become a name of variable
window[vari2] = 'Value of - val2';
alert(val2);         // show the value of val2

// Or part of the name
window['pre_'+vari2] = 'Value for - pre_val2';         // creates the "pre_val2" variable
alert(pre_val2);            // display the value of pre_val2
--></script>

- Click to see the result of example above.

When using dynamic variables

Dynamic variables are rarely used in JavaScript, you can write any script without using dynamic variables. But in some cases they are useful, for advanced programmers, they can make the code more dynamically.
Here is an example. The value selected from a Select list become the name of a variable, and the text of the selected <option> will be the value of that variable:

<script type="text/javascript"><!--
// this function is called when an option is selected
function example_vd(val3) {
  // with "window" we create dynamic variable, having in its name the value of 'val3'
  // assign to the dynamic variable the text from the selected option
  window['vd_'+val3] = document.getElementById(val3).innerHTML;

  var test_val = eval('vd_'+val3);           // gets the value of the dynamic variable set above
    /* Because we don`t know exactly the name,
     we need eval() to use the name of a dynamic variable to get its value */

  alert('Value of vd_'+ val3+ ' is: '+ test_val);           // test the result
}
--></script>

<form action="" method="post">Select an option:
 <select name="select" onchange="example_vd(this.value)">
  <option id="s1" value="s1">Option 1</option>
  <option id="s2" value="s2">Option 2</option>
  <option id="s3" value="s3">Option 3</option>
 </select>
</form>

- In this select list you can test the reslt of the example above.
Select an option:

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which tag is used to add definition lists into a <dl> element?
<dt> <dd> <li>
<dl>
 <dt>HTML</dt>
  <dd> - Hyper Text Markup Language</dd>
  <dd> - Language for web pages</dd>
</dl>
Which CSS property can hide an element on page, letting an empty space in its place?
display position visibility
#id {
  visibility: hidden;
}
Click on the event which is triggered when the mouse clicks on an object.
onclick onmouseover onfocus
document.getElementById("id").onclick = function(){
  alert("http://CoursesWeb.net/");
}
Indicate the PHP variable that contains the contents of both $_GET, $_POST, and $_COOKIE arrays.
$_SESSION $_GET $_REQUEST
if(isset($_REQUEST["id"])) {
  echo $_REQUEST["id"];
}
Dynamic variables in JavaScript

Last accessed pages

  1. HTTP Errors and Logging (39)
  2. Add, Change, and Remove Attributes with jQuery (35999)
  3. Select in MySQL, Output results in HTML Table (3789)
  4. jQuery Drag and Drop Rows between two similar Tables (6875)
  5. PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files (8371)

Popular pages this month

  1. Read Excel file data in PHP - PhpExcelReader (443)
  2. PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files (351)
  3. Register and show online users and visitors (319)
  4. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (300)
  5. Insert, Select and Update NULL value in MySQL (214)