Can't register ForwardHandler

[jlachowski]

Hello,

after migration from 3.5.1 to 3.8.1 registration of forward handlers does not work e.g following code results in error yl.registerForwardHandler is not a function. Would appreciate any suggestion how to solve it. Current documentation lacks the js example how to register a custom forward hander.

<script type="text/javascript" src="/static/admin/js/vendor/select2/select2.full.js"></script>
<script type="text/javascript" src="/static/autocomplete_light/autocomplete_light.js"></script>
<script type="text/javascript" src="/static/autocomplete_light/select2.js"></script>

.....

yl.registerForwardHandler("formset_forward_field", function (
  autocompleteElement
) {
  var res = [];
  var name = $(autocompleteElement).attr("name");
  var prefix = $(autocompleteElement).getFormPrefix();
  var suffix = name.substring(prefix.length, name.length);
  prefix = prefix.split("-").slice(0, -2).join("-") + "-";
  var elements = $(
    "[data-formset-form]:not([data-formset-form-deleted]) [name^=" +
      prefix +
      "][name$=" +
      suffix +
      "]"
  );
  $.each(elements, function (ix, e) {
    if (e.value) {
      res.push(e.value);
    }
  });
  return res;
});

[jpic]

Is the forward_different_fields example working in the test_project for you ? It seems fine here, and it does have some registerForwardHandler.

Does it work if you wrap your yl.registerForwardHandler in a document.ready like in the example project?

[mastershaig]

I did same as in example project but I've the same issue: Uncaught TypeError: yl.registerForwardHandler is not a function

[WordDragon]

Wrapping your code inside a $( document ).ready() solves the problem.

$(document).ready(function() {
    yl.registerForwardHandler("your_function", function (autocompleteElement) {
        your code...
    });
});

[jrobichaud]

I assumed it would work inside dal-init-function but its not:

document.addEventListener('dal-init-function', function () {
    yl.registerForwardHandler("your_function", function (autocompleteElement) {
        your code...
    });
});

Wrapping it like @WordDragon suggested worked.

Maybe dal-init-function should be called only when everything is initialized or a 'dal-init-forward' should be added.

Ex:

document.addEventListener('dal-init-forward', function () {
    yl.registerForwardHandler("your_function", function (autocompleteElement) {
        your code...
    });
});

[jrobichaud]

Wrapping it this way was not as reliable as I thought. It was working fine in Firefox but not in Chrome strangely.

However wrapping it this way instead is giving me reliable results in both Chrome and Firefox:

document.addEventListener('dal-init-function', function () {
    setTimeout(() => {
        yl.registerForwardHandler("your_function", function (autocompleteElement) {
            your code...
        });
    });
});