Turning PHP into JSON array when parsed in Javascript

Question

So, in order to create a page that has dynamic HTML, the following Javscript code was used:

function add0(Text, Value){ 
 var x = document.getElementById("thingy");
var option = document.createElement("option");
option.text = Text;
option.value = Value;
x.add(option);}
function add(Text, Value){ 
var x = document.getElementById("stuff");
var option = document.createElement("option");
option.text = Text;
option.value = Value;
x.add(option);}
var c = 0;
var value =<?php echo json_encode($ToAndFromR); ?>;
var formula = <?php echo json_encode($FormulaR); ?>;
while(c < <?php echo $countr ?>){
add0(value[c], formula[c]);
add(value[c], formula[c]);

c++;

}

This was done after recieving $ToAndFromR and $Formula from a SQL Query, in which the code is :

$conn = mysqli_connect($servername, $username, $password, $dbname);
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
//declare variables
$countr = null;
$sql = "SELECT * FROM `convert`";
$drippage = mysqli_query($conn, $sql); 
//this counts the number of rows
if (mysqli_num_rows($drippage)) {
    $countr = mysqli_num_rows($drippage);
}
$ToAndFrom = mysqli_query($conn, "SELECT ToAndFrom FROM `convert`");
$ToAndFromR = null;
$ToAndFromR = mysqli_fetch_all($ToAndFrom, MYSQLI_BOTH);

$FormulaR = null;
$Formula = mysqli_query($conn, "SELECT Formula FROM `convert`");
$FormulaR = mysqli_fetch_all($Formula, MYSQLI_BOTH);

However, the HTML gets shown as [object Object] in the dropdown list, as opposed to their actual values when a regular PHP array is used. Is there a way to fix this?

at add0(value[c], formula[c]); you'd need to point to the actual values, which will be in your case add0(value[c].ToAndFrom, formula[c].Formula);. besides this you should refactor your code so that you only have one sql call in your php (for performance reasons) — Jeff
– Jeff, Commented May 12, 2015 at 1:13
You're welcome. You can accept Phil's answer, as it says the same but with much more detail and a proper solution to do a single sql query. — Jeff
– Jeff, Commented May 12, 2015 at 1:20

Phil · Accepted Answer · 2015-05-12 01:22:18Z

Each Text and Value passed to your JavaScript functions will be an object with two properties (because you're using MYSQLI_BOTH fetch mode), eg

{"0": "some value", "ToAndFrom": "some value"}

You're attempting to assign this to the option's text and value properties.

You also appear to be running three queries when you should be running one.

mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
$conn = new mysqli($servername, $username, $password, $dbname);
$conn->set_charset('utf8');

$result = $conn->query('SELECT `ToAndFrom` AS `text`, `Formula` AS `value` FROM `convert`');
$options = $result->fetch_all(MYSQLI_ASSOC);

and in your JavaScript

var options = <?= json_encode($options) ?>;
for (var i = 0, l = options.length; i < l; i++) {
    add0(options[i].text, options[i].value);
    add(options[i].text, options[i].value);
}

Also, you could cut down on the almost identical JavaScript functions add0 and add by simply passing the <select> ID, eg

function add(selectId, text, value) {
    var x = document.getElementById(selectId);
    // and so on
}

with

add('thingy', options[i].text, options[i].value);
add('stuff', options[i].text, options[i].value);

Freya Ren · Accepted Answer · 2015-05-12 01:14:57Z

0

I think you should write a separate PHP script which echo the JSON.

Then in the javascript, you should call this PHP and parse the JSON. A simple code:

  var xhr = new XMLHttpRequest();
        xhr.open("GET", "sql.php", true);

        var htmltext= '';
        xhr.onload = function (e) {
            if (xhr.readyState === 4) {
                if (xhr.status === 200) {
                    var jsoninfo = xhr.responseText;
                    var obj = JSON.parse(jsoninfo);
                    // text = obj.attribute;
                    // add0(text,formula[c])
                   }
       }
}

answered May 12, 2015 at 1:14

Freya Ren

2,1648 gold badges29 silver badges40 bronze badges

2 Comments

Jeff Over a year ago

that doesn't solve his problem, which is not referring to the values, but only the objects in the json.

Phil Over a year ago

Why would adding complexity make this any better?

Collectives™ on Stack Overflow

Turning PHP into JSON array when parsed in Javascript

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related