javascript - Display nested objects using w3-repeat of w3.js library -


i'm trying display array of objects nested array of objects using tag w3-repeat of library w3.js. know it's not main used library, i'm new stuff , liked w3.css style css styling (simple , easy-to-learn) , i'm trying w3.js javascript side. i'm trying make table starting object this:

var myobject = {     "deliveries" : [         {         "state" : "inside",         "arrive" : "15/09/17 - 15:00",         "courier" : "courier 1",         "cli-cust" : [             {             "type" : "client",             "name" : "cli. name",             "goods" : [                 {"material" : "pasta",                 "qt" : "200"},                 {"material" : "bread",                  "qt" : "300"},                 {"material" : "oil",                  "qt" : "1000"}                 ]             },             {             "type" : "customer",             "name" : "name of customer",             "goods" : [                 {"material" : "water",                 "qt" : "100"},                 {"material" : "wine",                  "qt" : "3000"},                 {"material" : "prosecco",                  "qt" : "2000"}                 ]             }         ]         },         {         "state" : "outside",         "arrive" : "15/09/17 - 16:00",         "courier" : "courier 2",         "cli-cust" : [             {             "type" : "client",             "name" : "name of client 2",             "goods" : [                 {"material" : "notebook",                 "qt" : "10"},                 {"material" : "keyboard",                  "qt" : "30"}                 ]             }         ]         }     ] }

basically result should table this: table now, tryed tag w3-repeat seems work first level of array objects (state, arrive, courier), not others:
works fine:

<tr w3-repeat="deliveries"> <td>{{state}}</td> <td>{{arrive}}</td> <td>{{courier}}</td>

but second level object have tryed use like

<ul w3-repeat="cli-cust"> <li>{{type}}</li> <li>{{name}}</li> </ul>

and third level similar

<ul w3-repeat="goods"> <li>{{material}}</li> <li>{{qt}}</li> </ul>

but not work: gives {{type}}, {{name}}, {{material}}, {{qt}} text in output, seems can't use nested objects loop array. obtain same result using w3-repeat="deliveries.cli-cust" , w3-repeat="deliveries.goods" instead of w3-repeat="cli-cust" , w3-repeat="goods".

am missing or library can't support feature?

thanks
ettore


Comments

Post a Comment

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

i running os ububtu 16.04. ultimate goal able run php script cron job every minute. here php script located @ /var/www/html/tests/test/index.php : <?php $directorypath = $_server['document_root']."/tests/test/data/"; echo "directorypath: $directorypath<br><br>";//check $imagefilepathsarray = glob($directorypath . "*.{png,gif}", glob_brace); echo "<br><br>imagefilepathsarray: "; print_r($imagefilepathsarray);//check ?> when open php script in browser visiting url my-ip-address/tests/test/index.php , get: directorypath: /var/www/html/tests/test/data/ imagefilepathsarray:array( [0] => /var/www/html/tests/test/data/pic.png [1] => /var/www/html/tests/test/data/pic.gif ) before writing cron job in crontab file, need check if can run anywhere using terminal . opened ubuntu terminal @ /home/ location, , executed in terminal: sudo php /var/www/html/tests/test/index.php i got following out...
Read more

php - How can i create a user dashboard -

today have questions you, want create user dashboard site, include (obviously), users data, example -email -username -and others stuff how can information, , print them in html page? if can, how can these information via php sessions? shuld use session? example, if user login, , start new session ( session_start() ), how can data print in dashboard? should use php "project"? in advice, have day , thank time!
Read more

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -

i have jquery mobile page fixed full-screen toolbar, data-tap-toggle enabled. straight under toolbar have positioned banner should slide upwards when toolbar hiding , slide downward when toolbar showing. jquery mobile toggles toolbar applying , removing ui-fixed-hidden class - sadly, can't find in documentation of toolbar widget toggle , hide or show event that. how can detect when toolbar toggled, reposition banner? .banner { position: fixed; background-color: darkseagreen; top: 46px; min-height: 48px; width: 100%; text-align: center; line-height: 48px; } <!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.css"> <script src="https://code.jquery.com/jquery-1....
Read more