在Javascript代码中重复PHP

Question

I need to get and repeat my data from mysql, inside a javascript code.

Javascript Code:

var chart = c3.generate({
data: {
    columns: [
        ['data1', 30, 200, 100, 400, 150, 250, 50, 100, 250]
    ]
},
axis: {
    x: {
        type: 'category',
        categories: ['cat1', 'cat2', 'cat3', 'cat4', 'cat5', 'cat6', 'cat7', 'cat8', 'cat9']
    }
}});

I need change 'cat1' , 'cat2' , 'cat3'... for data from mysql. I use this code to get and repeat the info :

<?php do { ?>
       <?php echo $row_cat['category_name']; ?>
<?php } while ($row_cat = mysql_fetch_assoc($cat)); ?>

This works fine for me,but I can't use this inside javascript code. Do you know how can I make this work ?

Thanks.

Answer 1

I would personally just build your data structure in PHP and then output in javascript as a variable via json_encode. So something like:

$cat_names = array();
while ($row_cat = mysql_fetch_assoc($cat)) {
    $cat_names[] = $row_cat['category_name'];
}

Then in javascript:

var categories = <?php echo json_encode($cat_names); )?>;
var chart = c3.generate({
    data: {
        columns: [
            ['data1', 30, 200, 100, 400, 150, 250, 50, 100, 250]
        ]
    },
    axis: {
        x: {
            type: 'category',
            categories: categories
        }
    }
});

This is much, much cleaner and easier to read than trying to echo out HTML/javascript source with each iteration of the database read loop.

Note the change away from do...while I don't know why you would use that structure here for reading data out of a database. You also shouldn't be using mysql_* functions at all, but that is another story...