PHP within Javascript using jqplot

Question

This question has been asked a couple of times on here already but unfortunately the answers don't fix my problem.

The website is currently viewable live at http://www.crosstrendanalysis.co.uk/jqplot_test.php

The relevant code is below, however the crux of the problem lies within the code below;

var line1 = "<?php echo $outputString; ?>";

When I use the output (via copy and paste) of the $outputString instead of using php it creates a graph perfectly fine, however when I try and use php it doesn't work.

I'm trying to use JQPlot with an array obtained from a MySql database. The array is created with the following code

$weeknumbers = array();
$completedquestionnaires = array();

$output = array();
while($row=mysqli_fetch_assoc($resultQuestionnaireCount)){
//  $completedquestionnaires[] = $row['VolumeOfAnswers'];
//  $weeknumbers[] = $row['WeekNumber'];
$temp1 = array();
$temp2 = array();
$temp1[] = "".$row['WeekNumber']."";
$temp2[] = "".$row['VolumeOfAnswers']."";

$output[] = '[' . json_encode(implode(", ", $temp1)) . ', ' . implode(", ", $temp2) . ']';
//$output[] = $temp1;
}
//$outputTemp = implode(',\n',$output);
$outputString = '['.print_r(implode(",\n",$output),1).']';
$output = json_encode($output);

The JQPlot code is:

<script type="text/javascript">
$(document).ready(function(){
    var line1 = "<?php echo $outputString; ?>";
  var plot1 = $.jqplot('chart1', [line1], {
    title: 'Volume of questionnaires completed',
    series:[{renderer:$.jqplot.BarRenderer}],
    axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer ,
        tickOptions: {
          angle: -30,
          fontSize: '10pt'
        }
    },
    axes: {
      xaxis: {
        renderer: $.jqplot.CategoryAxisRenderer
      }
    }
  });
});
</script>

<div id="chart1" style="height:300px; width:500px;"></div>
<?php echo "<h3>";
echo  $output;
    echo "<br>";
    echo $outputString;
    echo "</h3>";?>

I have been struggling with this for quite some time so if anyone can fix this I would be hugely appreciative.

Thanks Maudise

Niet the Dark Absol · Accepted Answer · 2013-03-10 20:36:16Z

1

When you're outputting PHP, it's always a good idea to right-click the browser and view the source. In this case, you have something like this:

var line1 = "[.....],
[.....],
[.....]";

This is not valid, and your console should be telling you about an unterminated string constant.

You should always use json_encode to output PHP variables to JavaScript. In this case, your code should be rewritten like this:

$weeknumbers = array();
$completedquestionnaires = array();

$output = array();
while($row=mysqli_fetch_assoc($resultQuestionnaireCount)){
    $temp1[] = "".$row['WeekNumber']."";
    $temp2[] = "".$row['VolumeOfAnswers']."";

    $output[] = array($row['WeekNumber'], $row['VolumeOfAnswers']);
}
$outputString = json_encode($output);

Then in your JavaScript:

var line1 = <?php echo $outputString; ?>;

answered Mar 10, 2013 at 20:36

Niet the Dark Absol

326k86 gold badges480 silver badges604 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Maudise Over a year ago

Hi, That's fantastic! I had seen that you needed to encase it with " but it doesn't work in this instance, why is that? Also the scales are a bit strange, is there a way of having the volumeofanswers not being encassed in "" and therefore taken as an integer?

Niet the Dark Absol Over a year ago

json_encode will add quotes for you if the variable is a string. You can change the variable's type on the PHP side using intval.

Maudise Over a year ago

Brilliant, thanks for the help! I'm sure this will be of great use, I might need to tweak it here or there but you've got me over my stumbling block! THANKS!!

Collectives™ on Stack Overflow

PHP within Javascript using jqplot

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related