JSON очень легко можно перевести в JavaScript.
JavaScript можно использовать для создания HTML на ваших веб страницах.
HTML таблица
Составьте HTML таблицу с данными, полученными в формате JSON:
Пример
obj = { table: "customers", limit: 20 };
dbParam = JSON.stringify(obj);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4
&& this.status == 200) {
myObj = JSON.parse(this.responseText);
txt += "<table border='1'>"
for (x in myObj) {
txt += "<tr><td>" + myObj[x].name + "</td></tr>";
}
txt += "</table>"
document.getElementById("demo").innerHTML
= txt;
}
}
xmlhttp.open("POST", "json_demo_db_post.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("x=" + dbParam);
Попробуйте сами »
Таблица динамического HTML
Составьте HTML таблицу на основе значения раскрывающегося меню
Пример
<select id="myselect" onchange="change_myselect(this.value)">
<option value="">Choose an option:</option>
<option
value="customers">Customers</option>
<option
value="products">Products</option>
<option
value="suppliers">Suppliers</option>
</select>
<script>
function
change_myselect(sel) {
var obj, dbParam, xmlhttp, myObj,
x, txt = "";
obj = { table: sel, limit: 20 };
dbParam = JSON.stringify(obj);
xmlhttp = new
XMLHttpRequest();
xmlhttp.onreadystatechange =
function() {
if (this.readyState
== 4 && this.status == 200) {
myObj = JSON.parse(this.responseText);
txt += "<table border='1'>"
for (x in myObj) {
txt += "<tr><td>" + myObj[x].name + "</td></tr>";
}
txt +=
"</table>"
document.getElementById("demo").innerHTML = txt;
}
};
xmlhttp.open("POST", "json_demo_html_table.php",
true);
xmlhttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xmlhttp.send("x="
+ dbParam);
}
</script>
Попробуйте сами »
Раскрывающийся список HTML
Составьте раскрывающийся список HTML с данными, полученными в формате JSON:
Пример
obj = { table: "customers", limit: 20 };
dbParam = JSON.stringify(obj);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4
&& this.status == 200) {
myObj = JSON.parse(this.responseText);
txt += "<select>"
for (x in myObj) {
txt += "<option>" + myObj[x].name;
}
txt += "</select>"
document.getElementById("demo").innerHTML
= txt;
}
}
xmlhttp.open("POST", "json_demo_html_table.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("x=" + dbParam);
Попробуйте сами »