[5.3] Searchtools use requestSubmit() and add joomla:update listener

[LadySolveig]

Pull Request for Issue # .

Summary of Changes

This PR replaces submit() with requestSubmit() method to make it possible to work with the submit event in other places after submission of the searchtool filters. (e. g. submit form and only partly reload page via ajax).

You can find more information here https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/requestSubmit#usage_notes

It also adds a joomla:updated event event listener for this use case to reinitialize functionality after only partly reloading the page.

Testing Instructions

Preparation

const testSearchtools = () => {
  const searchtools = document.querySelector('.js-stools');
  if (!searchtools) {
    return;
  }

  document.addEventListener('submit', event => {
    console.log('Test searchtools submit', event.target);
  });

  // Cleanup
  document.removeEventListener('DOMContentLoaded', testSearchtools);
};

// Execute on DOM Loaded Event
document.addEventListener('DOMContentLoaded', testSearchtools);

• Add this code snippet at the bottom of your backend template javascript file.
  e. g. media/templates/administrator/atum/js/template.js

• Activate debug mode in backend.

• (Optional) Load sampledata via sample data plugin to have items to search and filter :)

• Open articles listview in backend and open your browser dev tools.

• Test filter, search and order functionality
  

After testing and checking the result before applying this PR

• Fetch the pr and run npm ci

• ReAdd code snippet to your backend template.

• Test filter, search and order functionality as before and check again the console log.

• Additional check filter and search functionality in other listviews to make sure all works as before.

Actual result BEFORE applying this Pull Request

Nothing should be shown in your browser developement console log.

Expected result AFTER applying this Pull Request

You should see something like this in your browser developement console log.

[Important] Search and filter should work as before!

Link to documentations

Please select:

• Documentation link for docs.joomla.org:

• No documentation changes for docs.joomla.org needed

• Pull Request link for manual.joomla.org:

• No documentation changes for manual.joomla.org needed

[LadySolveig]

I would appreciate your feedback on whether this change makes sense to you. 🙂 @dgrammatiko @Fedik

[Fedik]

Seems makes sense.
But we probabbly still should add a check if(form.requestSubmit), because in Safari it available only from 2022y

[LadySolveig]

Thanks for the suggestion, will add the additional check tomorrow. 👍🏼