Views Exposed Filters Optional Filters and Query Strings

[mkinnan]

Since Views Exposed Filters is deprecated in favor of Views Contextual Filters, what is the recommended path forward when there are multiple, optional user exposed filters? I ask to learn what will be the preferred route going forward with DrupalGap 7 that makes transition to DrupalGap 8 easier as well as what makes adding/deleting filters easiest.

When using Exposed filters in Drupal, the URL ends up like the following which makes it easy to modify (e.g., include, exclude) the query string parameters:

https://www.example.com/my-page?q=color=blue&shape=square&texture=smooth&years=1980-2020

but Views Contextual Filters format is like:

https://www.example.com/my-page/blue/square/smooth/1980-2020/

I'm trying to figure out the best approach in planning for future filter additions/deletions. For example, if down the line I realize having a 'color' filter in my above example isn't needed anymore I would break the link to the view (from the app) by deleting out the contextual filter 'color' in my View. So, I would have to create a 2nd duplicate view (with the filter removed) for future versions of the app. I don't think filters would change that much, but it seems messy to me for having lots of duplicated views. If I were able to use query strings, it would be easy to update the query string in the app and still use the same view page. Right??

Two Thoughts:

• Keep the Views pages in Drupal with Exposed filters. Remove the Exposed Filters rendering in the DrupalGap Views code and build a slide panel or popup on the page in the app with the filters? Then would just generate the query string in the app for the URL based on values set in a slide panel.
• Convert Views pages in Drupal to use contextual filters and install this drupal module in order to use query strings? https://www.drupal.org/project/views_contextual_filter_query

Query string based filtering to me seems like the best approach, especially with having a lot of filter options. I anticipate having about 15 filter options in the future for one of my pages. Maybe I'm overlooking the obvious?

Otherwise I'm afraid I would end up with weird URLs from adding/removing filters.

https://www.example.com/my-page/deleted/square/all/1980-2020/newfilter/deleted/all/smooth/

Thoughts?

[mkinnan]

Just to update ... I am currently using Views with exposed filters. In DrupalGap I hide the exposed filters to prevent them from displaying in the view. I created a full page slide panel when the user clicks a Search button. The panel contains a custom form with all my different filter options. In order to get around the bug https://github.com/signalpoint/DrupalGap/issues/935, I reload the pageshow on form submit ... I don't use drupalgap_goto. I modified the example below to fit my needs: http://docs.drupalgap.org/7/Views/Views_Contextual_Filters

Below is an abbreviated example of what I did that has been working great:

function my_module_myawesomepage_pageshow() {
  try {

    ...

    var field_tags_event_type_target_id_value = $("#edit-my-module-my-awesome-page-form-filter-eventtype").val();
    
    var querystring = '';

    if (field_tags_event_type_target_id_value) {
      var querystring = '?field_tags_event_type_target_id=' + field_tags_event_type_target_id_value;    
    }
    
    var content = {};
    
    content.results = {
      theme: 'view',
      format: 'ul',
      pager_pos: 'bottom',
      exposed_filters: false,
      path: 'my-awesome-page' + querystring,
      row_callback: 'my_module_myawesomepage_list_row',
      empty_callback: 'my_module_myawesomepage_list_empty'
    };

    ...
    
  }
  catch (error) { console.log('my_module_myawesomepage_pageshow - ' + error); }
}
    
    
function my_module_myawesomepage_form_submit(form, form_state) {
  try {
    
    var id = 'view_myawesomepage';

    $('#' + id).panel('close'); // Close the panel.

    // reload the results
    my_module_myawesomepage_pageshow();
    
  }
  catch (error) { console.log('my_module_myawesomepage_form_submit - ' + error); }
}