Jump to content
mpoirier

Problem using w3.js Display

Recommended Posts

Is there any way to display complex objects with w3.displayObject("id01", myObject) w3.js function ?

<!DOCTYPE html>
<html>
<title>W3.JS</title>
<meta charset="utf-8">
<script src="https://www.w3schools.com/lib/w3.js"></script>
<script>
var myObject= {"customers":[
{"CustomerName" : "Alfreds Futterkiste", "Address": {"City" : "Berlin","Country" : "Germany"}},
{"CustomerName" : "Berglunds snabbköp", "Address": {"City" : "Luleå","Country" : "Sweden"}},
{"CustomerName" : "Centro comercial Moctezuma", "Address": {"City" : "México D.F.","Country" : "Mexico"}},
{"CustomerName" : "Ernst Handel", "Address": {"City" : "Graz","Country" : "Austria"}},
{"CustomerName" : "FISSA Fabrica Inter. Salchichas S.A.", "Address": {"City" : "Madrid","Country" : "Spain"}}
]};
</script>
<body>
<h2>Testing W3.JS in HTML</h2>
<table id="id01">
  <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
  </tr>
  <tr w3-repeat="customers">
    <td>{{CustomerName}}</td>
    <td>{{Address.City}}</td>
    <td>{{Address.Country}}</td>
  </tr>
</table>
<script>
w3.displayObject("id01", myObject);
</script>
</body>
</html> 

Result:


Customer	City	Country
Alfreds Futterkiste	{{Address.City}}	{{Address.Country}}
Berglunds snabbköp	{{Address.City}}	{{Address.Country}}
Centro comercial Moctezuma	{{Address.City}}	{{Address.Country}}
Ernst Handel	{{Address.City}}	{{Address.Country}}
FISSA Fabrica Inter. Salchichas S.A.	{{Address.City}}	{{Address.Country}}

 

Thanks !

Edited by mpoirier
Added result

Share this post


Link to post
Share on other sites

It doesn't look like it supports that, it looks like it only supports dot notation for property names if you're using the repeat attribute to loop over an array.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×