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

I think it would be a great update and extremely usuful  for w3.js,  if it could support more complex objects like the example that mpoirier wrote.

Thanks, Ioannis

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...