Question

我通过ajax将一些表单数据发送到同一页面中的php脚本。 PHP必须处理数据并在同一页面中显示结果。

我在ajax中使用这种语法：

$.ajax
({
    type: "POST",
    url: "",
    data: $("form").serialize(),
    success: function(result)
    {
        updatechart();
       console.log(result);
    }
});

我基本上是尝试根据表单中输入的数据更新图表中的某些值，然后由php脚本处理。当我执行console.log(result);时，我得到了页面的完整源代码，并在执行此操作后在我的控制台中更新了值，但图表未更新。当我查看源页面时，值保持不变。我该怎么办？

    function updatechart() {
        var json=<?php echo json_encode($GLOBALS['json']); ?>;
        var direct=json['direct'];
        var total=json['total'];
        var referred=total-direct;
        var aid=new Array();
        var count=new Array();
        for(var i=0;i<json['aid'].length;i++) {
            aid[i]=json['aid'][i];
            count[i]=json['count'][i];
        }
    var series = [{
                name : "Referred",
                data: [referred]
            }, {
                name: "Direct",
                data: [direct]
            }];
       for(var i=0; i<aid.length;i++) {
            series.push({
                name: 'AID-'+[aid[i]],
                data: [count[i]]
            })
        }
    var options = {
        chart: {
            renderTo: 'container',
            type: 'column'
        },
        title: {
            text: 'User Source Chart'
        },
        xAxis: {
            categories: ['Users']
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Total users'
            }
        },
        tooltip: {
            pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
            shared: true
        },
        plotOptions: {
            column: {
                stacking: 'percent'
            }
        },
            series: series
    };
    chart = new Highcharts.Chart(options); 
}

这是我的updatechart（）代码。问题是，json值没有更新。

Answer 1

将result作为参数传递给updatechart()

$.ajax
({
    type: "POST",
    url: "",
    data: $("form").serialize(),
    success: function(result)
    {
        updatechart(result);      
    }
});

然后通过参数访问结果。

function updatechart(result) {
//.......
//.......
console.log(result);
}

希望你尝试这样的事情。

Answer 2

这是预期的行为。将PHP处理移动到其他页面。

$.ajax
({
    type: "POST",
    url: "anotherphppage.php",
    data: $("form").serialize(),
    success: function(result)
    {
        updatechart(result);      
    }
});

试试这个，你会明白我的意思：

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

        <script type="text/javascript">
            $(document).ready(function() {

                $('#mybutt').click(function() {
                    $.ajax({
                        type: "POST",
                        url: "",
                        data: 'myVar=Hello',
                        success: function(data) {
                            alert(data);
                        }
                    });
                });
            }); //END $(document).ready()

        </script>
    </head>
<body>

    Try this:<br />
    <input type="button" id="mybutt" value="Click Me">

</body>
</html>

ajax响应后未更新的值

2 个答案: