This is my HTML code
<table data-role="table" id="movie-table" data-filter="true" data-input="#filterTable-input" class="ui-responsive">
<thead>
<tr>
<th data-priority="1">Rank</th>
<th data-priority="persist">Player Name</th>
<th data-priority="2">Record</th>
<th data-priority="3"><abbr title="Rotten Tomato Rating">Points</abbr></th>
<th data-priority="4">Highlight</th>
</tr>
</thead>
<tbody >
<div id="table"></table>
</tbody>
</table>
**This is my Javascript/Jquery**
$( document ).ready(function()
{
$.get('./php/rank.php', function(data)
{
$('#table').html(data);
}).error(function() {
$('#table').append('An error has occured');
} ).success (function(){
$('#table').append('');
})
});
**This is my php**
echo "<tr>";
echo "<th>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "</tr>";
What I am trying to accomplish is to populate the table based on registered users. I tried to echo the complete table - no success(I'm using JQuery Mobile) So I thought maybe I can Just Echo the th and td tags that will vary. Any suggestions would be greatly appreciated, maybe I'm just going about this the wrong way. Thanks
I solved it. In php you have to echo the complete table.
echo "<table data-role='table' id='movie-table' data-filter='true' data-input='#filterTable-input' class='ui-responsive'>";
echo "<thead>";
echo "<tr>";
echo "<th data-priority='1'>Rank</th>";
echo "<th data-priority='persist'>Player Name</th>";
echo "<th data-priority='2'>Record</th>";
echo "<th data-priority='3'><abbr title='Rotten Tomato Rating'>Points</abbr></th>";
echo "<th data-priority='4'>Highlight</th>";
echo "</tr>";
echo "</thead>";
while($row1 = mysql_fetch_array($result1)){
echo "<tbody>";
echo "<tr>";
echo "<th>1</th>";
echo "<td>Kentwan</td>";
echo "<td>10-0</td>";
echo "<td>1000</td>";
echo "<td>test</td>";
echo "</tr>";
echo "</tbody>";
}
echo "</table>";
You are not closing your tags properly. Moreover, there is no need for a div insde tbody (I don't know if it's even allowed). Try with this corrected code:
<table data-role="table" id="movie-table" data-filter="true" data-input="#filterTable-input" class="ui-responsive">
<thead>
<tr>
<th data-priority="1">Rank</th>
<th data-priority="persist">Player Name</th>
<th data-priority="2">Record</th>
<th data-priority="3"><abbr title="Rotten Tomato Rating">Points</abbr></th>
<th data-priority="4">Highlight</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
**This is my Javascript/Jquery**
$( document ).ready(function()
{
$.get('./php/rank.php', function(data)
{
$('#movie-table tbody').html(data);
}).error(function() {
$('#movie-table tbody').append('An error has occured');
} ).success (function(){
$('#movie-table tbody').append('');
})
});
**This is my php**
echo "<tr>";
echo "<th>". $row1['points']."</th>";
echo "<td>". $row1['points']."</td>";
echo "<td>". $row1['points']."</td>";
echo "<td>". $row1['points']."</td>";
echo "<td>". $row1['points']."</td>";
echo "</tr>";
Edit: and of course you don't want to show the field "points" in all of the five columns.
Try something like this:
<table data-role="table" id="movie-table" data-filter="true" data-input="#filterTable-input" class="ui-responsive">
<thead>
<tr>
<th data-priority="1">Rank</th>
<th data-priority="persist">Player Name</th>
<th data-priority="2">Record</th>
<th data-priority="3"><abbr title="Rotten Tomato Rating">Points</abbr></th>
<th data-priority="4">Highlight</th>
</tr>
</thead>
<tbody id='tab_body'>
</tbody>
</table>
** your Javascript/Jquery**
$( document ).ready(function()
{
$.get('./php/rank.php', function(data)
{
$('#tab_body').html(data);
})
}