Adam First
Adam First

Reputation: 445

Inserting MySQL results from PHP into JavaScript Array

I'm trying to make a very simple autocomplete 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.

e.g. 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 what's 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.

Upvotes: 9

Views: 26318

Answers (3)

Max
Max

Reputation: 2112

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>

Upvotes: 13

Juribiyan
Juribiyan

Reputation: 740

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.

Upvotes: 0

anthonygore
anthonygore

Reputation: 4967

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

Upvotes: 4

Related Questions