i have written (in html) table , want "rewrite" when press "refresh data" button. far, lose of css style reason (like i' m creating new table scratch). code:
html - table :
<div id="priceinfo"> <button id="priceinfob">refresh data</button> </div> <table id="mytable" border='1'> <tr class="head"> <th></th> <th data-city="ny">new york</th> <th data-city="il">chicago</th> <th data-city="ca">san francisco</th> </tr> <tr> <th class='rowth' id="one"><a href="#" class="tooltip" rel="0">a poetic perspective</a></th> <td>sat, 4 feb 2012<br />11am - 2pm</td> <td>sat, 3 mar 2012<br />11am - 2pm</td> <td>sat, 17 mar 2012<br />11am - 2pm</td> </tr> <tr class="even"> <th class='rowth' id="two"><a href="#" class="tooltip" rel="1">walt whitman @ war</a></th> <td>sat, 7 apr 2012<br />11am - 1pm</td> <td>sat, 5 may 2012<br />11am - 1pm</td> <td>sat, 19 may 2012<br />11am - 1pm</td> </tr> <tr> <th class='rowth' id="three"><a href="#" class="tooltip" rel="2">found poems & outsider poetry</a></th> <td>sat, 9 jun 2012<br />11am - 2pm</td> <td>sat, 7 jul 2012<br />11am - 2pm</td> <td>sat, 21 jul 2012<br />11am - 2pm</td> </tr> <tr class="even"> <th class='rowth' id="four"><a href="#" class="tooltip" rel="3">natural death: exploration</a></th> <td>sat, 4 aug 2012<br />11am - 4pm</td> <td>sat, 8 sep 2012<br />11am - 4pm</td> <td>sat, 15 sep 2012<br />11am - 4pm</td> </tr> </table> json var :
var eventsjson='{"events":{"event":[{"id":"1","name":"a poetic perspective","isfree":"true","locations":[{"location":"new york","eventdate":"2015-05-02","eventtime":"14:00"},{"location":"chicago","eventdate":"2015-05-01","eventtime":"14:00"},{"location":"san francisco","eventdate":"2015-06-01","eventtime":"15:00"}],"descr":"vivamus elementum, diam eget ullamcorper fermentum, ligula libero euismod massa, quis condimentum tellus lacus sit."},{"id":"2","name":"walt whitman @ war","isfree":"false","locations":[{"location":"new york","eventdate":"2015-07-02","eventtime":"14:00"},{"location":"chicago","eventdate":"2015-07-01","eventtime":"14:00"},{"location":"san francisco","eventdate":"2015-08-01","eventtime":"15:00"}],"descr":"donec convallis eu metus eget dictum. etiam non lobortis dui."},{"id":"3","name":"found poems & outsider poetry","isfree":"false","locations":[{"location":"new york","eventdate":"2015-06-02","eventtime":"11:00"},{"location":"chicago","eventdate":"2015-07-01","eventtime":"14:00"},{"location":"san francisco","eventdate":"2015-06-01","eventtime":"15:00"}],"descr":"ut fermentum, elit vel iaculis viverra, dui libero ultrices nibh, ut ornare."},{"id":"4","name":"natural death: exploration","isfree":"true","locations":[{"location":"new york","eventdate":"2015-05-02","eventtime":"14:00"},{"location":"chicago","eventdate":"2015-05-01","eventtime":"14:00"},{"location":"san francisco","eventdate":"2015-06-01","eventtime":"15:00"}],"descr":"lorem ipsum dolor sit amet, consectetur adipiscing elit. praesent aliquet urna ut tortor consequat."}]}}'; any appreaciated. manual and/or command havent thought helpful!
- loop through json data
- for each record, clone table rows need. demo here
using jquery build table rows ajax response(json)
- swap cell data data json
- append rows table
Comments
Post a Comment