How to fetch data from the database into a javascript file and store it in array?

Question

I am building a currency converter app for my school project and at the moment I am trying to get data from the database into a .js file. The exact goal is to get data from the database and save it into an array within a .js file.

As far as I know there is no way to get data from the database directly into a JavaScript file, so I am trying to make use of JQuery and PHP combination as pointed out in this thread.

I have a database called 'currencies' which has six columns: id, basecur1, basecur2, basecur3, basecur4, basecur5. id field is for user id, and basecur_ fields are for storing user's prefered currencies and can only contain three characters of a currency code (like USD or GBP) or be empty. I need to get a result looking like const array_name = ["EUR", "GBP", "USD"];

Please note that I am using CodeIgniter PHP framework for back-end.

In this file query.php I am trying to create an array from the data fetched from the database and echo it:

<?php
$current_user = $this->session->user_id; 

$query = $this->db->get_where('currencies', array('id' => $current_user));
$row1 = $query->row();
$base_currencies = array($row1->basecur1, $row1->basecur2, $row1->basecur3, $row1->basecur4, $row1->basecur5);

$post_data = json_encode($base_currencies);
echo $post_data;
?>

Unfortunately, I don't have deep understanding of JavaScript, so I can't really say what's wrong with this JS code, which is taken from the thread mentioned above, but it doesn't really work for me:

jQuery.extend({
getValues: function(url) {
    var result = null;
    $.ajax({
        url: url,
        type: 'get',
        dataType: 'json',
        async: false,
        success: function(data) {
            result = JSON.stringify(data);
        }
    });
   return result;
}
});

var array_name = $.getValues("query.php");

Any help will be much appreciated.

you are trying to save the results in a `.js` file? or was that a mistype as your code seems to show the opposite — Alex, Apr 29 '19 at 22:08
I am trying to store the results in an array inside a ```.js``` file. Sorry, if the original description was unclear, I'll change it — JoJo223, Apr 29 '19 at 22:32
where is your code to save it as a `.js` file? (tbh it should be saved as a `.json` file). are you sure you don't want to just *serve* a json response rather than *save* (an actual physical file) to disk? — Alex, Apr 30 '19 at 00:55

Alex · Answer 1 · 2019-04-30T01:17:31.757

Because of these line you already have a valid json string:

$post_data = json_encode($base_currencies);
echo $post_data;
exit;

and since you already set the dataType: 'json' jquery will parse the result as a json string regardless of the header.

Thus:

success: function(data) {
        result = data;
    }

You can debug using console.log it is a valuable tool for learning and making sure you are getting what you want at various points in your code. As another user suggested, make sure you aren't getting any 404 errors in the console. query.php doesn't look like a valid CodeIgniter route.

AnC · Answer 2 · 2019-04-30T05:31:21.047

0

I think you are not passing a valid url try adding an error function to get some info:

var result = null;
$.ajax({
    url: url,
    type: 'get',
    dataType: 'json',
    async: false,
    success: function(data) {
        result = data
    },
    error: function(error) {
        alert(error);
    }
});
return result;

Update: Try to output the variable directly as alex has suggested

edited Apr 30 '19 at 05:31

answered Apr 29 '19 at 22:14

AnC

641
4
16

I am getting ```[object Object]``` message. – JoJo223 Apr 29 '19 at 22:55

score 0 · Answer 3 · answered Apr 29 '19 at 23:08

0

In your php file.

header('Content-Type: application/json');

in your ajax function

success: function(response){
console.log(resposne)
}

see if you are getting anything

answered Apr 29 '19 at 23:08

Aditya Thakur

2,562
2
10
21

How to fetch data from the database into a javascript file and store it in array?

3 Answers3