Properly bind form submit on cluster select

freesound/static/bw-frontend/src/components/asyncSection.js

@@ -12,6 +12,9 @@ const prepareAsyncSections = (container) => {
  element.innerHTML = req.responseText;
  // Make sure we initialize sound/pack players inside the async section
  initializeStuffInContainer(element, true, false);
+
+ // Also trigger event to notify that async section has been loaded (this is currently used in search page to perform some actions)
+ document.dispatchEvent(new Event('async_section_loaded'));
  } else {
  // Unexpected errors happened while processing request: show toast
  showToast('Unexpected errors occurred while loading some of the content of this page. Please try again later...')

freesound/static/bw-frontend/src/pages/search.js

@@ -176,14 +176,19 @@ if (sortByElement !== null){
  })
 }
 
-// Make radio cluster elements submit the form when changed
-document.getElementsByName('cid').forEach(radio => { 
- radio.addEventListener('change', (evt) => {
- setTimeout(() => {
- searchFormElement.submit();
- }, 100); // Give it a little time to update the radio widget before submitting
- });
-})
+// Make radio cluster elements submit the form when changed (also when cluster section is loaded asynchronously)
+export const bindClusteringRadioButtonsSubmit = () => {
+ document.getElementsByName('cid').forEach(radio => { 
+ radio.addEventListener('change', (evt) => {
+ setTimeout(() => {
+ searchFormElement.submit();
+ }, 100); // Give it a little time to update the radio widget before submitting
+ });
+ })
+}
+bindClusteringRadioButtonsSubmit();
+document.addEventListener('async_section_loaded', () => bindClusteringRadioButtonsSubmit());
+
 
 document.body.addEventListener('keydown', evt => {
  const ENTER_KEY = 13