Contrib.social

Add option to choose if 'hx-push-url' should be True in the exposed form

Open on Drupal.org →
Created on 10 August 2025, 19 days ago

Problem/Motivation

Currently, in the view's HTMX display, the exposed form does not update URLs to the browser. While this is the expected behaviour and fine for some cases, sometimes we need the URLs in the browser, based on the selected filters, so that we can share and bookmark the links accordingly.

In Drupal's standard AJAX enabled view, this can be achieved either through Custom JS code or through Views AJAX History → module.
But in HTMX views, we won't need extra JS code or module to achieve the same because HTMX already has hx-push-url attribute. We just have to set hx-push-url to true and HTMX takes care of URL updates, history and browser navigation.

Proposed resolution


We will add a checkbox to set push_url option in the view's UI: section. This will decide if the user wants to update URLs through the exposed form or not.

Here is the code to achieve this. In src/Plugin/views/display/Htmx.php,

  protected function defineOptions() {
    $options = parent::defineOptions();
    $options['push_url'] = ['default' => FALSE];
    return $options;
  }

  public function optionsSummary(&$categories, &$options) {
    parent::optionsSummary($categories, $options);

    $options['push_url'] = [
      'category' => 'exposed',
      'title' => $this->t('Push Url'),
      'value' => $this->getOption('push_url') ? $this->t('Yes') : $this->t('No'),
      'desc' => $this->t('Change whether or not the exposed filters will push urls to browser\'s address bar.'),
    ];
  }
  public function buildOptionsForm(&$form, FormStateInterface $form_state) {
    parent::buildOptionsForm($form, $form_state);

    $section = $form_state->get('section');

    if ($section == 'push_url') {
      $form['#title'] .= $this->t('Push Url');
      $form['push_url'] = [
        '#description' => $this->t('The Urls will be updated in the address bar'),
        '#type' => 'checkbox',
        '#title' => $this->t('Push Url'),
        '#default_value' => $this->getOption('push_url') ? 1 : 0,
      ];
    }
  }

  public function submitOptionsForm(&$form, FormStateInterface $form_state) {
    parent::submitOptionsForm($form, $form_state);

    $section = $form_state->get('section');

    if ($form_state->getValue('push_url')) {
      $this->setOption('push_url', (bool) $form_state->getValue('push_url'));
    }
    else {
      unset($this->options['push_url']);
      unset($this->display['display_options']['push_url']);
    }

  }


We already have htmx_form_views_exposed_form_alter(), where we can modify the code to adjust the hx-push-url attribute through pushUrl().

function htmx_form_views_exposed_form_alter(&$form, FormStateInterface $form_state, $form_id): void {
  // .....
  //Fetches the value of push_url. Can be TRUE or FALSE. 
  $pushUrl = $view->getDisplay()->options['push_url'];

  // .....
  // Sets hx-push-url to true or false based on $pushUrl value. 
  $htmx->pushUrl($pushUrl)
}

Data model changes

Not really any change in data model. Just adds an extra option in views display.

✨ Feature request
Status

Active

Version

1.5

Component

Upstream Code

Created by

🇳🇵Nepal sandeshyadav Dhangadhi, Kailali

Live updates comments and jobs are added and updated live.
  • views

    Involves, uses, or integrates with views. In Drupal 8 core, use the “VDC” tag instead.

Sign in to follow issues

Merge Requests

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024