I made the chages to your php and the javascript. This should work. You might also want to change or remove the table that has the text for name, type, ect.
Let me know how it goes. ;3
<?php
include("functions/functions.php");
include("functions/functions_users.php");
include("functions/functions_adopts.php");
include("classes/class_pagination.php");
include("css/pagination.css");
include("inc/lang.php");
//***************//
// START SCRIPT //
//***************//
$id = $_GET["id"];
$act = $_GET["act"];
$more = $_GET["more"];
$page = $_GET["page"];
if($isloggedin == "yes")
{
$article_content = "<p id='activate_sort'>
Click here to sort your adoptables
</p>
<table>
<tr>
<th></th><th>Name and Type</th><th>Image</th><th>Clicks</th>
</tr>
</table>
<table>";
// We need to get all of the user's adoptables from the database and display them...
$query = "SELECT *
FROM {$prefix}owned_adoptables
LEFT JOIN {$prefix}sort_adoptables
ON {$prefix}owned_adoptables.aid = {$prefix}sort_adoptables.adoptable_id
INNER JOIN {$prefix}levels
ON {$prefix}levels.thisislevel = {$prefix}owned_adoptables.currentlevel
INNER JOIN {$prefix}adoptables
ON {$prefix}owned_adoptables.type = {$prefix}adoptables.type
WHERE {$prefix}owned_adoptables.owner = '{$loggedinname}'
AND {$prefix}levels.adoptiename = {$prefix}adoptables.type
ORDER BY {$prefix}sort_adoptables.sorting_id";
$stmt = $adopts->query($query);
$cols = 3; //the number of columns
do{
$article_content .= "<tr>";
for($i=1;$i<=$cols;$i++){
while($row = $stmt->fetchObject()){
if($row->usealternates == 'yes') $image = $row->alternateimage;
else $image = $row->primaryimage;
if($row->currentlevel == 0) $image = $row->eggimage;
if($image=='') $image = $row->primaryimage;
$article_content .= "tent .= "
<td class='sortable_adoptables'>
<table id='orderaid_{$row['aid']}'><tr>
<td><img src='{$image}' width='20px' height='20px'></td>
<td width=50%> </td> <!-- Create gap between columns -->
</tr> </table></td>";
}
else{
$article_content .= "<td> </td>"; //If there are no more records at the end, add a blank column
}
}
} while($row);
$article_content .= "</table>";
}
//***************//
// OUTPUT PAGE //
//***************//
echo showpage($article_title, $article_content, $date);
?>
<script type="text/javascript">
$(document).ready(function(){
$('body').undelegate('click').delegate('p#activate _sort', 'click', function(){
var realBg = $('table#sortable_adoptables').css('background-color');
var submitForm = '<form name="submit_order" id="submit_order" action="" method="post"><fieldset><label for="submit">Click and drag a Pokemon to switch it with another Pokemon.</br></br></label><input type="submit" id="submit" value="Save Changes"></fieldset></form>';
$('.sortable_adoptables')
.css('background-color', '#FFFF66')
.animate({ backgroundColor: realBg }, 'slow' )
.sortable({
cursor: 'pointer', connectWith: ".sortable_adoptables", receive: function(event, ui) {
var $this = $(this);
if ($this.children('table').length > 1) {
$this.children('table').not(ui.item).appendTo(ui.s ender);
}
}
});
$(submitForm).insertAfter('p#activate_sort').hide( ).slideDown();
$('p#activate_sort').attr('id', 'deactivate_sort');
});
$('body').undelegate('submit').delegate('form#subm it_order', 'submit', function(event){
event.preventDefault();
var data = $.map($('.sortable_adoptables'), function(v, i){
return $(v).sortable('serialize');
});
data = data.join("&");
$.post('ajax_sort.php', data, function(result){
$('form#submit_order').html(result).delay(5000).fa deOut('slow', function(){
$(this).remove();
});
});
$('.sortable_adoptables').sortable('destroy');
$('p#deactivate_sort').attr('id', 'activate_sort');
});
});
</script>