javascript function using a multidimensional array

Discussion in 'JavaScript' started by murphyts, Feb 7, 2007.

  1. #1
    Hello,
    I am trying to update text fields on a page based on a selection from a drop down menu. the data is generated from a PHP multidimensional array, which is then passed to Javascript in the body of the page as the same multidimenional array called "dr". the data is actually driver names and for each driver truck number, trailer number, phone number. the array is passed correctly because i can use

    document.write(dr['name1']['TrailerN']);

    for example and the correct value is displayed.
    I am having difficulties however with the populating of the text fields. I use onChange event to trigger the following function, which i have in the <head> section of the page:

    <script type="text/javascript">
    function update(this) {
    var textboxValue = this.value;
    document.getElementById("TruckN").value=dr['textboxValue']['TruckN'].value;
    document.getElementById("TrailerN").value=dr['textboxValue']['TrailerN'].value;
    document.getElementById("PhoneN").value=dr['textboxValue']['PhoneN'].value;
    }
    </script>


    This doesn't work. Help anyone?
     
    murphyts, Feb 7, 2007 IP
  2. giraph

    giraph Guest

    Messages:
    484
    Likes Received:
    27
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I don't believe you should be using .value at the end of

    
    dr['textboxValue']['TruckN'].value;
    
    Code (markup):
    Because referencing that far already gets you the data inside the array.

    So do

    
    <script type="text/javascript">
    function update(this) {
    var textboxValue = this.value;
    document.getElementById("TruckN").value=dr['textboxValue']['TruckN'];
    document.getElementById("TrailerN").value=dr['textboxValue']['TrailerN'];
    document.getElementById("PhoneN").value=dr['textboxValue']['PhoneN'];
    }
    </script>
    
    Code (markup):
     
    giraph, Feb 7, 2007 IP
  3. murphyts

    murphyts Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    thanx for the reply. tried this, doesn't work.
     
    murphyts, Feb 7, 2007 IP
  4. giraph

    giraph Guest

    Messages:
    484
    Likes Received:
    27
    Best Answers:
    0
    Trophy Points:
    0
    #4
    if
    
    document.write(dr['name1']['TrailerN']);
    
    Code (markup):
    works and you have elements with an id of TrailerN then
    
    document.getElementById("TrailerN").value=dr['name1']['TrailerN'];
    
    Code (markup):
    will work. I can't say anything more than that because you're giving me about 5% of your code. E.g. The following code works fine

    
    <script type="text/javascript">
    var arr = new Array();
    arr['f1'] = new Array();
    arr['f1']['f2'] = "Blah";
    function update()
    {
    	document.getElementById("one").value = arr['f1']['f2'];
    }
    </script>
    <input id="one" onclick="update();" />
    
    Code (markup):
    OR

    
    <script type="text/javascript">
    var arr = new Array();
    arr['f1'] = new Array();
    arr['f1']['f2'] = "Blah";
    function update(x)
    {
    	x.value = arr['f1']['f2'];
    }
    </script>
    <input id="one" onclick="update(this);" />
    
    Code (markup):
     
    giraph, Feb 7, 2007 IP
  5. murphyts

    murphyts Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    ok,
    here's how i generate the php array:

    $query="SELECT * FROM drivers order by Name";
    $result=mysql_query($query);
    while ($row = mysql_fetch_object($result)){
    $NameN = $row -> Name;
    $MENU[$NameN]['TruckN'] = $row -> Truck;
    $MENU[$NameN]['TrailerN'] = $row -> Trailer;
    $MENU[$NameN]['PhoneN'] = $row -> Phone;
    }

    I am using this function to pass the array to javascript:

    function arrayToJS4($array, $baseName) {
    echo $baseName . " = new Array(); \n ";
    reset ($array);
    while (list($key, $value) = each($array)) {
    if (is_numeric($key)) {
    $outKey = "[" . $key . "]";
    } else {
    $outKey = "['" . $key . "']";
    }
    if (is_array($value)) {
    arrayToJS4($value, $baseName . $outKey);
    } else {
    echo $baseName . $outKey . " = ";
    if (is_string($value)) {
    echo "'" . $value . "'; \n ";
    } else if ($value === false) {
    echo "false; \n";
    } else if ($value === NULL) {
    echo "null; \n";
    } else if ($value === true) {
    echo "true; \n";
    } else {
    echo $value . "; \n";
    }
    }
    }
    }

    Then:

    echo "<script language=\"JavaScript\">\n";
    echo arrayToJS4($MENU, "dr");
    echo "</script>\n";

    At this point
    document.write(dr['name1']['TrailerN']);
    where name1 is an actual name from the array outputs the correct value.

    I am using the following form:

    <form name="form" method="post" action="editdriver1.php">
    <?php
    echo "<select id=\"NameN\" name=\"NameN\" onchange=\"update(this)\" class=\"a_class\">\n";
    echo "<option value=\"0\" selected >Choose a driver</option>\n";
    foreach ($MENU as $_KEY => $_VAL){
    echo "<option value=\"".$_KEY."\">".$_KEY."</option>\n";
    }
    echo "</select>\n";
    ?>
    </div></td>
    <td><div align="center">
    <input name="TruckN" id="TruckN" type="text" value="" class="a_class" />
    </div></td>
    <td><div align="center">
    <input name="TrailerN" id="TrailerN" type="text" value="" class="a_class" />
    </div></td>
    <td><div align="center">
    <input name="PhoneN" id="PhoneN" type="text" value="" class="a_class" />
    </div></td>
    </tr>
    </table>
    <p>&nbsp;</p>
    <table width="20%" border="0">
    <COLGROUP span="2" width="0*">
    <tr>
    <td><div align="center">
    <input type="submit" class="bUgi" name="Update" value="Update">
    </form>
    </div></td>
    <td><div align="center">
    <form name="form7" method="post" action="drivers.php">
    <input type="submit" class="bUgi" name="Submit" value="Go back">
    </form>

    Sorry for the mess, i couldn't figure how to put the code in a textarea. Hope this will help you understand the case better.
     
    murphyts, Feb 7, 2007 IP
  6. murphyts

    murphyts Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Solved!

    I changed to this:

    
    echo "<select id=\"NameN\" name=\"NameN\" onchange=\"update()\" class=\"a_class\">\n"; 
    
    Code (markup):
    And from the javascript function i had to ommit the single quotes around textboxValue :) now it works like this:

    
    <script language="JavaScript">
    function update() {
    var textboxValue = document.getElementById("NameN").value
    document.getElementById("TruckN").value=dr[textboxValue]['TruckN'];
    document.getElementById("TrailerN").value=dr[textboxValue]['TrailerN'];
    document.getElementById("PhoneN").value=dr[textboxValue]['PhoneN'];
    }
    </script>
    
    Code (markup):
     
    murphyts, Feb 8, 2007 IP