Aurelia.js how to add a new row in a table? without use jquery

Question

how can I add a new row in a table? using Aurelia.js without use jquery.

will be possible do this just with Aurelia.js ?

 export class App { }

 <!doctype html> <html> <head> <title>Aurelia</title> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body aurelia-app> <table> <tr> <td> elem 1 </td> <td> elem 2</td> <td> elem 3</td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td> <button type="button" class="btn btn-info">Add</button> </td> </tr> </table> <script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script> <script src="https://jdanyow.github.io/rjs-bundle/config.js"></script> <script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script> <script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script> <script> require(['aurelia-bootstrapper']); </script> </body> </html>

Answer 1

As the thebluefox said, you're far way from having something working. You should read the docs and learn some basics.

Anyway, the answer you're looking for is:

<tr repeat.for="item of items">
  <td>${item.property1}</td>
  <td>${item.property2}</td>
  <td>${item.property3}</td>
  <td>${item.property4}</td>
</tr>

Now, every time you push an object into items , a new line in the table will be created.

Hope this helps!

Aurelia.js how to add a new row in a table? without use jquery

Question

1 answers

solution1
2 ACCPTED 2017-05-12 12:52:35

Aurelia.js how to add a new row in a table? without use jquery

Question

1 answers

solution1 2 ACCPTED 2017-05-12 12:52:35

solution1
2 ACCPTED 2017-05-12 12:52:35