Bluto Posted December 6, 2017 Posted December 6, 2017 The below code produces a dynamic menu which sorts my content dynamically (without a page load). I'm trying to move this menu into a series of buttons, but not matter what I try, I can't figure out how to do it. Here is what the existing menu looks like: Here is the existing code for the menu: <ul class="ipsButtonRow ipsPos_right ipsClearfix"> {{if isset( $table->sortOptions ) and !empty( $table->sortOptions )}} <li> <a href="#elSortByMenu_menu" id="elSortByMenu_{$table->uniqueId}" data-role='sortButton' data-ipsMenu data-ipsMenu-activeClass="ipsButtonRow_active" data-ipsMenu-selectable="radio">{lang="sort_by"} <i class="fa fa-caret-down"></i></a> <ul class="ipsMenu ipsMenu_auto ipsMenu_withStem ipsMenu_selectable ipsHide" id="elSortByMenu_{$table->uniqueId}_menu"> {{$custom = TRUE;}} {{foreach $table->sortOptions as $k => $col}} <li class="ipsMenu_item {{if $col === $table->getSortByColumn()}}{{$custom = FALSE;}}ipsMenu_itemChecked{{endif}}" data-ipsMenuValue="{$col}" data-sortDirection='{{if $col == 'title'}}asc{{else}}desc{{endif}}'> <a href="{$table->baseUrl->setQueryString( array( 'filter' => $table->filter, 'sortby' => $col, 'sortdirection' => ( $col == 'title' ) ? 'asc' : 'desc', 'page' => '1' ) )}">{lang="{$table->langPrefix}sort_{$k}"}</a> </li> {{endforeach}} </ul> </li> {{endif}} </ul> Here is the code for the content: <ol class='ipsDataList ipsDataList_zebra ipsClear cCmsListing {{foreach $table->classes as $class}}{$class} {{endforeach}}' id='elTable_{$table->uniqueId}' data-role="tableRows"> {template="$table->rowsTemplate[1]" params="$table, $headers, $rows" object="$table->rowsTemplate[0]"} </ol> Here is the series of buttons I created: <div class='ipsGrid ipsGrid_collapseTablet ipsGrid_collapsePhone ipsSpacer_bottom' > <div class='ipsGrid_span5 ipsType_contained'> <div class="ipsType_veryLarge"> <div class='ipsGrid ipsGrid_collapseTablet ipsGrid_collapsePhone' > <div class='ipsGrid_span4 ipsType_contained'> <a class="ipsButton ipsButton_normal ipsButton_fullWidth" href="(link)">NEWEST</a> </div> <div class='ipsGrid_span4 ipsType_contained'> <a class="ipsButton ipsButton_normal ipsButton_fullWidth" href="(link)">VIEWS</a> </div> <div class='ipsGrid_span4 ipsType_contained'> <a class="ipsButton ipsButton_normal ipsButton_fullWidth" href="(link)">UPDATED</a> </div> </div> </div> </div> </div> Thanks in advance for your help!
Recommended Posts
Archived
This topic is now archived and is closed to further replies.