同时返回JSON和HTML的AJAX调用 [英] Return both JSON and HTML in AJAX call

问题描述

我有几页用沉重的JavaScript的使用（例如排序和数据集的过滤）。

I have a few pages with an heavy javascript usage (e.g. sorting and filtering of a dataset).

典型的用​​途是显示复杂的项目清单（通常呈现为＆LT;李＆GT; 用HTML内）：用户可以删除，编辑或添加项目具体形式。由于该项目是复杂的，我把JavaScript对象的数组进行任何的操作，如执行任何操作之前验证用户输入。

The typical usage is to display a list of complex items (usually rendered as <li> with some HTML inside): the user can delete, edit or add items with specific forms. Since the items are complex, I keep an array of javascript objects to perform any sort of operations, such as validate the user input before performing any action.

用户的动作和细节被发送到通过异步调用服务器：结果到达后，我必须更新HTML和JavaScript的数组

The user's action and details are sent to the server via asynchronous calls: after the outcome arrives I have to update both the HTML and the javascript array.

我用这个技巧：服务器返回的JSON-CN codeD的数据结构和更新的HTML作为一个字符串。一旦数据到达，一些javascript code分裂响应，并解析所述第一组块为JSON（更新阵列），并把所述第二组块在容器的内的HTML，取代previous含量

I use this hack: the server returns the json-encoded data structure and the updated HTML as a single string. Upon data arrival, some javascript code splits the response and parses the first chunk as json (updating the array) and puts the second chunk in the inner html of the container, replacing the previous content.

我不希望生成数据结构的HTML，因为它不是一个人的应用程序和网页设计师改变HTML布局往往（和独立）。 既不欲从HTML（太复杂且易出错）。

I don't want to generate the HTML from the data structure, since it is not a one-man application, and the web designers change the HTML layout quite often (and independently). Neither I want to recreate the data structure from the HTML (too complex and error-prone).

该系统的工作原理相当不错，有一些问题只与大的内容，是跨浏览器  （是建立在jQuery的），似乎并未有大的性能问题。

This system works quite nicely, having some problems only with big content, is cross-browser (is built on jQuery) and doesn't seem to have big performance issues.

现在的问题是：我失去了一些东西微妙的（或者明显），使该解决方案不好？ 是否存在一个更简单，更好的解决方案在吗？

The question is: am I missing something subtle (or maybe obvious) that makes this solution bad? Does it exists a simpler and better solution around?

顺便说一句，在服务器运行PHP。

By the way, the server runs PHP.

感谢你。

推荐答案

所以presumably你有两个变量：一个HTML字符串（ $ html_string ）和PHP信息阵列将在JSON格式发送（$ array_of_info <$ C C $>）。然后：

So presumably you have two variables: a HTML string ($html_string) and an PHP array of information which will be sent in JSON format ($array_of_info). Then:

$a = array(
  'html' => $html_string,
  'json' => $array_of_info
);
header('Content-Type: application/json');
echo json_encode($a);

这此的输出是略长于从简单地串联在HTML和JSON字符串，但在客户端解析应该更容易。而且可能更快。而且，正如在评论中指出，不容易出错。

The output from this is slightly longer than that from simply concatenating the HTML and JSON strings, but the parsing on the client side should be easier. And probably faster. And, as pointed out in the comments, less error-prone.

这篇关于同时返回JSON和HTML的AJAX调用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！