Home » Php » Inserting MYSQL results from PHP into Javascript Array

Inserting MYSQL results from PHP into Javascript Array

Posted by: admin July 12, 2020 Leave a comment

Questions:

I’m trying to make a very simple auto-complete function on a private website using a trie in javascript. Problem is the examples I have seen and trying are just using a predefined list in a javascript array.

eg. var arrayObjects = ["Dog","Cat","House","Mouse"];

What I want to do is retrieve MYSQL results using PHP and put them into a javascript array.

This is what I have so far for the PHP (the Javascript is fine just need to populate the array):

<?php 
    $mysqli = new mysqli('SERVER', 'U/NAME', 'P/WORD', 'DB');
    if (!$mysqli)
    {
        die('Could not connect: ' . mysqli_error($mysqli));
    }
    if ($stmt = $mysqli->prepare("SELECT category.name FROM category")) {
        $stmt->bind_result($name);
        $OK = $stmt->execute();
    }   
while($stmt->fetch()) 
    {
     printf("%s, ", $name); 
    }
?>

Then I want to insert essentially each value using something like mysql_fetch_array($name); (I know this is incorrect but just to show you guys whats going on in my head)

<script> -- this is the javascript part
(function() {
    <?php while $stmt=mysql_fetch_array($name))
     {
       ?>
        var arrayObjects = [<?php stmt($name) ?>];
    <?php } 
       ?>

I can retrieve the results echoing out fine, I can manipulate the trie fine without MYSQL results, I just can’t put them together, any help would be greatly appreciated and if I am going the completely wrong way about it please let me know.

Thanks,

Adam

How to&Answers:

Firstly, there is a VERY big difference between java and javascript 🙂
Now, in this case, what you’re doing is looping through your result array, and each time you’re printing out the line var arrayObjects = [<?php stmt($name) ?>];. However this doesn’t convert between the PHP array you’re getting as a result, and a javascript array.

Since you started doing it this way, you can do:

<?php
    //bind to $name
    if ($stmt = $mysqli->prepare("SELECT category.name FROM category")) {
        $stmt->bind_result($name);
        $OK = $stmt->execute();
    }
    //put all of the resulting names into a PHP array
    $result_array = Array();
    while($stmt->fetch()) {
        $result_array[] = $name;
    }
    //convert the PHP array into JSON format, so it works with javascript
    $json_array = json_encode($result_array);
?>

<script>
    //now put it into the javascript
    var arrayObjects = <?php echo $json_array; ?>
</script>

Answer:

Use json_encode to turn your PHP array into a valid javascript object. For example, if you’ve got the results from your database in a php array called $array:

var obj = "<?php echo json_encode($array); ?>";

You can now use obj in your javascript code

Answer:

For the auto-completion you can use the <datalist> tag. This is a relatively new feature in HTML5 (see support table) but the polyfill exists.
Fill the <option> tags in php when building the page and you a are done.