W3Data Http
The examples on this page are the same as the examples on the previous page, except that the data are requested from a web server: customers.php
Filling a Dropdown
Example
<select id="id01">
<option subhodaya-repeat="customers">{{CustomerName}}</option>
</select>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>
Try It Yourself »
<option subhodaya-repeat="customers">{{CustomerName}}</option>
</select>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>
Filling a List
Example
<ul id="id01">
<li subhodaya-repeat="customers">{{CustomerName}}</li>
</ul>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>
Try It Yourself »
<li subhodaya-repeat="customers">{{CustomerName}}</li>
</ul>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>
Filling a Table
Example
<table id="id01">
<tr>
<th>Customer</th>
<th>City</th>
<th>Country</th>
</tr>
<tr subhodaya-repeat="customers">
<td>{{CustomerName}}</td>
<td>{{City}}</td>
<td>{{Country}}</td>
</tr>
</table>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>
Try It Yourself »
<tr>
<th>Customer</th>
<th>City</th>
<th>Country</th>
</tr>
<tr subhodaya-repeat="customers">
<td>{{CustomerName}}</td>
<td>{{City}}</td>
<td>{{Country}}</td>
</tr>
</table>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>
Filling Another Table
Example
<table id="id01">
<tr>
<th>Title</th>
<th>Artist</th>
<th>Price</th>
</tr>
<tr subhodaya-repeat="cd">
<td>{{title}}</td>
<td>{{artist}}</td>
<td>{{price}}</td>
</tr>
</table>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>
Try It Yourself »
<tr>
<th>Title</th>
<th>Artist</th>
<th>Price</th>
</tr>
<tr subhodaya-repeat="cd">
<td>{{title}}</td>
<td>{{artist}}</td>
<td>{{price}}</td>
</tr>
</table>
<script>
w3Http("customers.php", function () {
if (this.readyState == 4 && this.status == 200) {
var myObject = JSON.parse(this.responseText);
w3DisplayData("id01", myObject);
}
});
</script>