I want to switch between two methods of sorting and displaying items in Views by toggling a button. My exposed filters are in the URL so I want to include the query in the path in order to keep the exposed filter results. Both displays of the view have “use ajax” set to “yes”.
My link is :
$link_path = ($display_data->display_options['path'] . '/nojs'); $query = drupal_get_query_parameters(); $toggle_link = l($toggle_icon, $link_path, array('html' => true, 'query' => $query, 'attributes' => array('class' => array('use-ajax'))));
Which outputs something like:
<a href="href="/my_view_page_1/nojs?terms=test¶m1[0]=123">[omitted SVG path for brevity]</a>
In a js file in my theme, I have:
/** * Toggle button and ajax views */ var viewId = settings.mytheme_toggle_view.view; var viewDisplayId = settings.mytheme_toggle_view.current_display; var viewOtherDisplayId = settings.mytheme_toggle_view.other_display; $.ajax({ url: settings.basePath + 'views/ajax/' + settings.mytheme_toggle_view.query, type: 'post', data: { view_name: viewId, view_display_id: viewOtherDisplayId, view_args: {}, // your views arguments }, dataType: 'json', success: function (response) { var newView = ($(response[1].data)); $(".view-display-id-" + viewDisplayId).replaceWith($(newView)); } }); /* End views ajax stuff. */
What happens now:
- I go to my view and select my exposed filters and hit “apply”
- I arrive at my view’s default display page
- Before I can click anything, AJAX fires and replaces the view content with the alternative view content.
- If I click the toggle, it is a link (with full page reload, not AJAX) to the default display page again.
- Step 3 repeats.
What I want is for the view to
- Not change on pageload, but wait until the toggle button is clicked
- Be able to be toggled back and forth rather than only toggling once and then becoming a regular, page-reloading link.
- Preserve the exposed filters
- Have the pager still work (currently is a link to some JSON output of the settings object).