With 2 forms on the same page, both with checkboxes, ajax validation and submission are broken

[Makulia]

Hello dear Fabrik community!

We have a serious bug here. Issue has been tested and confirmd on Joomla builds 3.3.6+ and Fabrik builds 3.3.1+. Only checkbox field type is affected.

Form fields instant ajax validation (after field looses focus) is broken when we have 2 or more forms on the same page if:

Both forms containing checkbox fields

AND

Both forms option "Ajax validation" is set to: Yes

AND

Both form submition type "Ajaxify" is set to: Yes

Validation and submission are broken in the first form in DOM while in the second form input field disappears after submission.

Browser console output:

TypeError: window[el[0]] is not a constructor   form.js:652:16

And after some idle time another ouput in a console:

Error: Load timeout for modules: element/checkbox/checkbox
http://requirejs.org/docs/errors.html#timeout   jquery.min.js line 2 > eval:8:252
Empty string passed to getElementById().

Browser points to the string in form.js:

var oEl = new window[el[0]](el[1], el[2]);

 

[Makulia]

Seems like it is a conflict between form.js and bootstrap.min.js.
This bug is affecting Fabrik builds: 3.3.1, 3.3.2, 3.3.3/ and Joomla 3 builds: 3.3.6+
I have recorded a short video reproducing this issue. Pls, have a look.
I have tried latest github builds with no lack.

 

[rob]

did you try updating from github?

 

[Makulia]

Sure, as I mentioned, I have tried latest github updates as well!

 

[rob]

I can replicate this, its pretty odd, in that one of the form's is not including the checkbox code - hence the js errors. I will continue investigating as to why that is

 

[rob]

aha! I think I have fixed it, could you update from github and let me know if your form now works?
For reference the relevant commit is https://github.com/Fabrik/fabrik/commit/98525f4d7e21639b86b58d948abb28a1fcf6e1a9

 

[Makulia]

Thank you, Rob! Greate work. With latest commit this issue is gone.
Forms are validated and submitions works.

But JS warning appears in a browser console every time I click on a checkbox:

Empty string passed to getElementById().