JQuery mobile worksheets not working
I am working with new jQuery Mobiles mobile tables. I have 3 tables, 2 of them work fine as expected, but for some reason the latter refuses to work.
Here's the code:
<table data-role='table' id='TableProfile' class='ui-responsive table-stroke'>
<thead>
<tr>
<th data-priority='persist'>#</th>
<th data-priority='persist'>Title</th>
<th>Author</th>
<th>Publisher</th>
<th>Edition</th>
<th data-priority='3'>Condition</th>
<th data-priority='2'>Price</th>
<th>Sold</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Thomas Calculus Early Transcendentals</td>
<td>MD.Weir, GB.Thomas Jr, J. Hass, FR.Giordano</td>
<td>Brooks/Cole</td>
<td>12</td>
<td>5</td>
<td>750</td>
<td><input type='button' value='Sold' name=70/></td>
</tr>
<tr>
<td>2</td>
<td>Thomas Calculus Early Transcendentals</td>
<td>MD.Weir, GB.Thomas Jr, J. Hass, FR.Giordano</td>
<td>Brooks/Cole</td>
<td>10</td>
<td>4</td>
<td>1000</td>
<td><input type='button' value='Sold' name=73/></td>
</tr>
</tbody>
</table>
I am using jQuery Mobile version 1.3, but I'm pretty sure why this table is not working.
+3
source to share
2 answers
Are you sure you are using jQuery> 1.7? JQuerymobile requires jQuery 1.7 or higher to work.
I have tried and it seems to work.
The standard way to do it is:
<table data-role="table" id="my-table" data-mode="reflow">
<thead>
<tr>
<th>Rank</th>
<th>Movie Title</th>
<th>Year</th>
<th><abbr title="Rotten Tomato Rating">Rating</abbr></th>
<th>Reviews</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td><a href="foo.com" data-rel="external">Citizen Kane</a></td>
<td>1941</td>
<td>100%</td>
<td>74</td>
</tr>
</tbody>
</table>
Working example of your code: http://jsfiddle.net/AYSJZ
+1
source to share