Joomla Subform adding row, the selector event is not fired if I change the value of the select element?

by user2363969   Last Updated July 29, 2020 14:10 PM - source

I have a subform which is working perfectly itself. If I add a new row (+), I have add the function as mentioned on joomla subform documentation:

jQuery(document).on('subform-row-add', function(event, row){
            jQuery('.timepicker').timepicker();

            // jform_tsch__tsch1__trln / jform_tsch__tsch1__lfld
            var lcID    = 'jform_tsch__' + jQuery(row).data('group') + '__trln';
            var flID    = 'jform_tsch__' + jQuery(row).data('group') + '__lfld';
            var loccode = jQuery('#jform_tsch__' + jQuery(row).data('group') + '__trln').val();

            var init    = false;
            jQuery('#'+ lcID).trigger("liszt:updated");
            console.log('lcID: ' + lcID + ' - data group: ' + jQuery(row).data('group') + ' - loccode: ' + loccode);

            getLocationFields(loccode, flID, init);
        });

This is sofar working perfect.

But I have also an event selector for event on id and here I have an issue with for the new row if the new row is not first saved:

jQuery('select[id^=jform_tsch__tsch][id$=__trln]').change(function () {
            //jform_tsch__tsch0__trln
            //jform_tsch__tsch1__trln
            var lcid = jQuery(this).attr('id'); //DK, IS
            var target = lcid.split('__');
            //field ID, #
            var flID = target[0]+'__'+target[1] + '__lfld';
            //var fsel = jQuery('#'+subID).val();
            var loccode = jQuery(this).val();
            var init = false;

            getLocationFields(loccode, flID, init);
 });

When an row of the subform is saved, it works perfectly. When I change the select field of

'jform_tsch__tschx__trln'

, then is (geLocationFields) executed.

BUT: If I add a new row to the subform and I change the select of 'jform_tsch__tsch0__trln', nothing is happening=executed.

If I save the details page incl. the new row of the subform and if I change than the value of the select of 'jform_tsch__tsch0__trln', the event trigger is executed.

So it seems to me that the new row is not added to the DOM. Therefore I have add the line jQuery('#'+ lcID).trigger("liszt:updated");

But that makes no difference.

Anybody an idea how to get the new row field in 'jQuery(document).on('subform-row-add', function(event, row){' working with the event selector, without first to have saving the details page?? Do I have to add an eventlistener with jQuery? (but how) Do I have to update the DOM in one or other way?

Thanks in advance,

BR,

Nico

Tags : subform


Related Questions


Sub Form Field Frontend Editing

Updated September 10, 2016 08:06 AM

How to use Subform in nested Subforms

Updated August 16, 2019 21:10 PM


New Sub Form Field - Show in layout?

Updated July 17, 2017 08:10 AM