2

I had posted : passsing data to https by JSON using JSONP ,and tried to change the highchart by call back to JSONP but still I don't get any result. Could any one tell me what is the problem (perhaps I think the way, which I callback is wrong.)?

data.php:

<?php  header("content-type: application/json"); 
$servername = "xxxxxx";
$username = "xxxxxx";
$password = "xxxxxx";
$dbname = "xxxxxx";

$con = mysql_connect($servername,$username,$password,$dbname);

if (!$con) {
    die('Could not connect: ' . mysql_error());
}

mysql_select_db("xxxxxxxxxx", $con);

if (isset($_GET["dateparam"])) {
    $sql = mysql_query("SELECT timestamp_value, User_Logins FROM foot_traffic WHERE timestamp_value LIKE '".$_GET["dateparam"]."%'");
} else {
    $sql = mysql_query("SELECT timestamp_value, User_Logins FROM foot_traffic WHERE timestamp_value LIKE '2013-02-01%'");
}

$result['name'] = 'User_Logins over Time Period';

while($r = mysql_fetch_array($sql)) {
    $datetime = $r['timestamp_value'];
    $result['category'][] = $datetime;
    $result['data'][] = $r['User_Logins'];
}

echo $_GET['callback']. '('. json_encode($result) . ')';

print json_encode($result, JSON_NUMERIC_CHECK);

mysql_close($con);
?>

file.php:

<html>
<head>
<script type="text/javascript">
var hey;
$(document).ready(function() {

hey = {
    chart: {
        renderTo: 'container1',
        type: 'area',
        borderColor: "#3366ff",
        borderWidth:5,
        zoomType : 'x'
    },
    title: {
        text: 'All User_Logins of your All Organizations '
    },
    subtitle: {
        text: ' '
    },
    credits:{
        enabled:false
    },    
    xAxis: {
        categories: [],
        labels: {
            align: 'center',
            x: -3,
            y: 20,
            formatter: function(){
                return Highcharts.dateFormat('%l%p',Date.parse(this.value +' UTC'));
            }
        }
    },
    yAxis: {
        title: {
            text: ''
        }
    },
    tooltip: {
        backgroundColor: '#FCFFC5',
        borderColor: 'black',
        borderRadius: 10,
        borderWidth: 3
    },
    // Enable for both axes
    tooltip: {
        borderWidth: 0,
        backgroundColor: "rgba(255,255,255,0)",
        borderRadius: 0,
        shadow: false,
        useHTML: true,
        percentageDecimals: 2,
        backgroundColor: "rgba(255,255,255,1)",
        formatter: function () {

            return '<div class="tooltip">' + this.point.name + '<br />' + '<b>' +
            Highcharts.numberFormat(this.y).replace(",", " ") + ' Kč [' + 
            Highcharts.numberFormat(this.percentage, 2) + '%]</b></div>';
        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: true
            },
            enableMouseTracking: false
        }
    },
    series: [{
        type: 'area',
        name: '',
        data: []
    }]
}

$.getJSON("data.php?callback=?", function(json){
    hey.xAxis.categories = json['category'];
    hey.series[0].name = json['name'];
    hey.series[0].data = json['data'];
    chart = new Highcharts.Chart(hey);
});

});

$(function() {
    $( "#datepicker" ).datepicker({
        dateFormat: "yy-mm-dd",
        showOn: "button",
        buttonImage: "calendar.gif",
        buttonImageOnly: true,
        onSelect: function(dateText, inst) { 
            $.getJSON("data.php?dateparam?callback=?"+dateText, function(json){
                hey.xAxis.categories = json['category'];
                hey.series[0].name = json['name'];
                hey.series[0].data = json['data'];
                chart = new Highcharts.Chart(hey);
                });
            }
        });
    });
</script>
</head>
<body>
<!--date picker-->
<input type="text" id="datepicker" />
<!-- highchart container-->
<div id="container1" class="analysis" style=" margin: 0 auto">
</div>
</body>
</html>
Community
  • 1
  • 1
moh89
  • 133
  • 1
  • 2
  • 12
  • You misunderstood my suggestion. I didn't say `add my whole line` but add `add callback encapsulation`. I think there is more to fix: your URL is wrong, I think. I suggest to read more about JSONP in the first place. For example [see this](http://stackoverflow.com/questions/2067472/what-is-jsonp-all-about). – Paweł Fus Feb 22 '16 at 13:04
  • **Danger**: You are using [an **obsolete** database API](http://stackoverflow.com/q/12859942/19068) and should use a [modern replacement](http://php.net/manual/en/mysqlinfo.api.choosing.php). You are **vulnerable to [SQL injection attacks](http://bobby-tables.com/)** that a modern API would make it easier to [defend](http://stackoverflow.com/questions/60174/best-way-to-prevent-sql-injection-in-php) yourself from. – Quentin Feb 23 '16 at 16:15
  • JSONP is not JSON. The correct content-type is `application/javascript`. – Quentin Feb 23 '16 at 16:15
  • Possible duplicate of [JSONP request to PHP page not working (cross domain)](http://stackoverflow.com/questions/5896965/jsonp-request-to-php-page-not-working-cross-domain) – Paul Sweatte Oct 21 '16 at 06:12

0 Answers0