sorting options for toptopic resault array

Started by glennmckenna, July 16, 2016, 04:23:04 PM

Previous topic - Next topic

glennmckenna

hello,

I've been looking at a to give the users of my site the option to sort the toptopic by either number of replies or number of visits.
and i found table sorter

http://tablesorter.com/docs/#Configuration

but my problem is that it won't sort the table for me, on the web page i can see it being initiated but it isn't sorting the table
here is a copy of the code (the table is right at the bottom)
I've also attached a copy of the jquery
<?php
require_once('scripts/SSI-link.php');

$context['page_title_html_safe'] = '';
if (empty(
$context['html_headers']))
   
$context['html_headers'] = '';


template_header();
//votre code vas ici sous format html
echo '
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
 <!-- Indicators -->
 <ol class="carousel-indicators">
   <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
   <li data-target="#carousel-example-generic" data-slide-to="1"></li>
   <li data-target="#carousel-example-generic" data-slide-to="2"></li>
 </ol>

 <!-- Wrapper for slides -->
 <div class="carousel-inner" role="listbox">
   <div class="item active">
     <img src="images/placeholder-image-wide.png" alt="...">
     <div class="carousel-caption">
       ...
     </div>
   </div>
   <div class="item">
     <img src="images/placeholder-image-wide.png" alt="...">
     <div class="carousel-caption">
       ...
     </div>
   </div>
 </div>

 <!-- Controls -->
 <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
   <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
   <span class="sr-only">Previous</span>
 </a>
 <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
   <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
   <span class="sr-only">Next</span>
 </a>
</div>



<div class="col-md-6 col-xs-12">
   <a class="twitter-timeline" href="https://twitter.com/MDLPalissy" data-widget-id="706827167091576833" width="100%">Tweets de @MDLPalissy</a>
     <script>
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>'
;
$rec = ssi_recentTopics(10, NULL, NULL,'array');
$pop = ssi_topTopicsReplies(10, 'array');
echo
'
<div class="col-md-6 col-xs-12">
   <table class="table_list">
       <tbody class="header">
           <tr>
               <td colspan="4">
                   <div class="cat_bar">
                       <h3 class="catbg">
                          '
,$txt['recent_posts'],'

                       </h3>
                   </div>
               </td>
           </tr>
       </tbody>    
       <tbody class="content">
           <tr class="windowbg4">
   '
;
               foreach (
$rec as $recent)
               {
                   echo
'
                    <tr class="windowbg4">
                       <td class="icon" style="height:40px;">
                           
                       </td>
                       <td class="info">'
;
                           echo
'
                           <a class="subject" href="'
, $recent['board']['href'], '">', $recent['board']['name'], '</a>';
                           echo
'
                           <p><a href="'
, $recent['href'], '">', $recent['link'],'</a> ', $txt['by'];
                           echo
'
                           <a href="'
, $recent['poster']['href'],'">', $recent['poster']['name'],'</a> </p>
                       </td>
                       <td class="date">
                           <p>'
,$recent['time'],'</p>
                       </td>
                       <td class="icon lastpost-1">
                           <a href="'
, $recent['href'], '"><img src="', $settings['images_url'], '/', $context['theme_variant_url'], '/icons/last_post.gif" alt="', $txt['latest_post'], '" title="', $txt['latest_post'], '" /></a>
                       </td>
                    </tr>'
;
               }
               echo
'          
           </tr>
       </tbody>

       <tbody class="divider">
           <tr>
               <td colspan="4"></td>
           </tr>
       </tbody>

        <tbody class="divider">
           <tr>
               <td colspan="4"></td>
           </tr>
       </tbody>
   </table>  
   <table class="table_list tablesorter" id="tablesort">
       <thead class="header">
           <tr>
               <th class="th-home" colspan="2">
                   <div class="cat_bar-home-l">
                       <h3 class="catbg">
                          '
,$txt['recent_posts'],'
                       </h3>
                   </div>
               </th>
               <th class="th-home">
                   <div class="cat_bar-home">
                       <h3 class="catbg Sort">
                          '
,$txt['views'],'
                       </h3>
                   </div>
               </th>
               <th class="th-home">
                   <div class="cat_bar-home">
                       <h3 class="catbg Sort">
                          '
,$txt['replies'],'
                       </h3>
                   </div>
               </th>
               <th class="th-home">
                   <div class="cat_bar-home-r">
                       <h3 class="catbg">
                       </h3>
                   </div>
               </th>  
           </tr>
       </thead>            
       <tbody class="content">
           <tr class="windowbg4">
   '
;
               foreach (
$pop as $popu)
               {
                   echo
'
                        <tr class="windowbg4">
                           <td class="icon" style="height:40px;">
                               
                           </td>
                           <td class="info">
                               <a class="subject" href="'
, $popu['href'],'">', $popu['subject'], '</a>
                           </td>
                           <td class="date">
                               <p>'
,$popu['num_views'],'</p>
                           </td>
                           <td class="date">
                               <p>'
,$popu['num_replies'],'</p>
                           </td>
                           <td class="icon lastpost-1">
                               <a href="'
, $popu['href'], '"><img src="', $settings['images_url'], '/', $context['theme_variant_url'], '/icons/last_post.gif" alt="', $txt['latest_post'], '" title="', $txt['latest_post'], '" /></a>
                           </td>
                        </tr>'
;
               }
                echo
'
           </tr>
       </tbody>
   </table>
      <script src="scripts/jquery-1.12.0.min.js"></script>
   <script src="scripts/jquery.tablesorter.js"></script>
<script type="text/javascript">
$(function() {
$("#tablesort").tablesorter();
});
</script>
</div>'
;

template_footer() ;
?>


could it due to the fact that I'm out putting an array ?
how could i possibly sort this table

here is a link to the web page (its the second table)
http://beta.mdl-palissy.fr/

yaax

You created only simple table sorter interface. According to table sorter docs you need to do something like this:
* @example $('table').tablesorter({ sortList : [ [ 0,0 ] , [ 1, 0 ] ] });
* @desc Create a tablesorter interface and sort on the first and secound column column headers.
Free SMF hosting:
http://www.ForumSide.com/

Free OpenCart shop hosting -
http://www.GetFreeShop.com/

glennmckenna

Quote from: yaax on July 16, 2016, 06:32:59 PM
You created only simple table sorter interface. According to table sorter docs you need to do something like this:
* @example $('table').tablesorter({ sortList : [ [ 0,0 ] , [ 1, 0 ] ] });
* @desc Create a tablesorter interface and sort on the first and secound column column headers.

no that is only for if i want to sort certain collums, but now i just want to get it working on the whole table

here is the error i keep on geting every time i click on header to insiate the sorting

jquery.tablesorter.js:614 Uncaught Type
Error: Cannot read property 'type' of undefined

Advertisement: