Question

我正在尝试使用Ajax，php / Codeigniter和Javascript动态创建一些内容，方法是将视图中的表单提交到获取和填充数组的控制器。 idéa是使用表单中的输入获取数据，并在第一个视图中创建图表（基于获取的数据）以在弹出div中显示。

我从主视图中调用此方法提交表单：

function test() {
    var url = "path/to/controller/"; 
    $.ajax({
        type: "POST",
        url: url,
        data: $("#myForm").serialize(), 
        success: function(data) {
            $('#test-container').show();
            $('#test-container').html(data);
        }
    });
}

到填充数组的控制器脚本中的一个函数，我们称之为fetchedData;

function getSomeData() {
    /* ..Fetching data.. */
    return fetchedData;
}

现在我想在第一个视图中使用填充数组，其中Ajax调用是在弹出的div中进行的，如：

<div>
    /* ...Use the content of the returned array (fetchedData) to make some charts with javascript and php..  */
</div>

由于我不知道如何处理数组中的数据，因此没有显示任何内容。这是可能的还是错误的做法？我是否应该将内容作为新视图加载到控制器中并尝试在弹出div中显示...？

Answer 1

“return fetchedData;” php函数返回PHP中的数据。

但它不会将“数据”返回给调用PHP脚本的ajax函数。

要获取数据，您需要将$fetchedData转换为字符串并回显该字符串，然后该字符串将转到运行javascript函数的浏览器。当然，您需要解析字符串以将其转换为对象。

所以你的php必须对数据进行编码，如下所示：

$data_json = htmlentities(json_encode($data));
echo $data_json;

然后您可以将生成的json数据解析为对象;

var data = $.parseJSON(json_data);

Answer 2

可以将不同的数据类型返回给ajax请求。这段代码

$('#test-container').html(data);

暗示 - 至少 - 返回纯文本，尽管文本也很可能包含html标记。您需要知道类型 data将要使用的内容。也明白data是你在PHP函数中回应的内容。返回的最常见数据类型是text / html和json。

如果fetchedData是一个数组，那么你想要返回json，它通常在浏览器中显示为一个javascript对象。

通过在PHP中构建一个关联数组，如

$foo = 'fooish';
$bar = 123;
$out = array('somedata' => $foo, 'otherdata' => $bar);

然后将此json编码版本回显给客户端

echo json_encode($out);

data的{{1}}对象看起来像

success

您可以使用标准的javascript表示法来访问对象的属性，例如{somedata: 'fooish', otherdata: 123}或data.somedata。

另一方面，如果您从服务器创建一些html和echo

data.otherdata

然后echo "<div class='cool-stuff'>The value of $foo is $bar</div>";将包含字符串“fooish的值为123”，并且使用调用data可能会在浏览器中生成输出。（无论如何，如果存在id为'test-container'的html元素，它应该存在。）

我希望这可以帮助您了解获得所需结果的可能方法。

使用来自Ajax调用的返回数据，动态内容

2 个答案: