I have been looking at why column sort orders wouldn't change in the front list view of my component and found by changing

        <?php echo HtmlHelper::_('searchtools.sort',  'JGRID_HEADING_ID', 'invlines.id', $listDirn, $listOrder); ?>


        <?php echo HtmlHelper::_('grid.sort',  'JGRID_HEADING_ID', 'invlines.id', $listDirn, $listOrder); ?>

that it all started working and that has set me off trying to understanding what i should be using.

Not that I can find any documentation to support this but it seems to me looking at Joomla document and examples that /libraries/cms/html/grid.php is mostly used in the front end examples while libraries/cms/html/searchtools.php is used in the back end in the examples and tutorials I have found.

seachtools.sort also seems to be more modern using layouts to render the html.

Is anyone able to confirm this is the case or provide some explanation of when to use one over the other?


Looking closer at the code behind the two options I can see that grid.sort will produce this html

<a href="#" onclick="Joomla.tableOrdering('orders.creditor_id','asc','');return false;" class="hasPopover" title="" data-content="Select to sort by this column" data-placement="top" data-original-title="Supplier Id">Supplier Id</a>

and grid.sort uses this pieces of JS to update the two hidden fields in the form, filter_order and filter_order_dir

Joomla.tableOrdering = function( order, dir, task, form ) {
    if ( typeof form  === 'undefined' ) {
        form = document.getElementById( 'adminForm' );

    form.filter_order.value = order;
    form.filter_order_Dir.value = dir;
    Joomla.submitform( task, form );

While searchtools.grid creates the following html

<a href="#" onclick="return false;" class="js-stools-column-order hasPopover" data-order="invlines.invoice_num" data-direction="ASC" data-name="Purchase Invoice #" title="" data-content="Select to sort by this column" data-placement="top" data-original-title="Purchase Invoice #">
Purchase Invoice #</a>

and from there it uses the /media/jui/js/jquery.searchtools.js to pick up when the column heading has been clicked and which way it should be sorted. From there I am not exactly sure how or where that info is stored when the form is submitted.


The difference is that with grid.sort you have basic ordering and searchtools.sort you have more options such as search field, search by published items, unpublished items, trashed items and more. Both can be used in the backend but searchtools.sort is more recommended since you have more options.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.