Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Sep 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Array [document.getElementById().value][2] not working

    Hello everyone this is my first post. Hope somebody here can help me.

    I have a mySql query then from the data an array is created. With values from the array a dropdown list for a form is created. Then a javascript array is created from the php array. and an onchange() function is trying to change an image in a field, using the ID value from the dropdown list selection (dropd.value) as key in the Array (to display the image name).

    Code:
    <?PHP
    include 'open_connection_con.php';
    $prod_query = mysqli_query($con,"SELECT id, type, image_name, description FROM Products");
    					
    $products = array();
    while($row = mysqli_fetch_array($prod_query))
    	{
    		$products[] = $row;
    	}
    					
    // then I create a dropdown list within a form.
    echo "<select name='prodType' id='prodDrop' onchange='swapProd()'>";
    echo "<option value='0'>Select one:</option>";
    foreach ($products as $row)
    	{
    		echo "<option value='" . $row['id'] . "'>" . $row['type'] . "</option>";
    	}
    echo "</select>";
    
    mysqli_close($con);
    ?>
                    
    <script type="text/javascript">
    
    // pass the php array into a javascript array.
    var prodArrJS = <?php echo json_encode($products);?>
    
    // and the function to display the image (on <img id="prodImage">) of the selected product from the dropdown list above
    function swapProd()
    {
    var image = document.getElementById("prodImage");
    var dropd = document.getElementById("prodDrop");
    image.src = "images/ex/" + prodArrJS[dropd.value][2] + ".jpg";
    var p1=document.getElementById("lar");
    p1.value="x"
    }
    </script>
                    
    <?php
    unset( $products );
    ?>
    The image at the end of the function is not displayed (nothing is displayed, not even the little question mark) and the function stops.
    I have tested the array with numbers and strings and it works ok.
    Thanks in advance.
    R.Mars

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    To resolve JavaScript problems is easier if you post the actual HTML/JavaScript that the browser sees rather than to original server side script.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #3
    New to the CF scene
    Join Date
    Sep 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The function swapProd() remains the same, the array looks like this:

    var prodArrJS = [{"0":"37","id":"37","1":"xxx","type":"xxx","2":"yyy","image_name":"yyy","3":"zzz","description":"zzz "},{"0":"38" etc. ... ...}]

    I notice that the values are duplicated, it is using numbers as keys but also the table's column's names. But I have tested the dropd.value and it works fine in other places (like for ex. displaying it in a field), just not in the brackets of the array.

  • #4
    New Coder
    Join Date
    Aug 2013
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Please forgive my utter ignorance of what you posted, but what little i have discovered about JS is that the GET by id seems to work only for stuff like id='prodDrop' and not name='prodType'.
    I hope that my stupid response here is of help and does not offend.

  • #5
    Senior Coder Dormilich's Avatar
    Join Date
    Jan 2010
    Location
    Behind the Wall
    Posts
    3,331
    Thanks
    13
    Thanked 348 Times in 344 Posts
    Quote Originally Posted by robert.mars View Post
    I notice that the values are duplicated, it is using numbers as keys but also the table's column's names.
    that’s due to the default fetch mode (MYSQLI_BOTH).
    The computer is always right. The computer is always right. The computer is always right. Take it from someone who has programmed for over ten years: not once has the computational mechanism of the machine malfunctioned.
    André Behrens, NY Times Software Developer


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •