Capturing button click in JavaScript

  • Resolved bobmeans

    (@bobmeans)


    5 years, 11 months ago

    Great plugin – thanks for making it!
    I’m trying to incorporate repeatable fields into a custom quote form. I have set up a document.addEventListener that looks at the class name to determine when to update the calculations with no problem. My problem is when the user clicks the wpcf7-field-group-remove button I can’t figure out how to grab that event. I used

    document.addEventListener( ‘change’, function (event) {
    if (event.target.classList.contains(‘wpcf7-field-group-remove’)) {
    console.log(‘remove happened’);
    calculate(form, discount);
    }
    });
    Any pointers on how to do this in JavaScript (not jQuery)?
    It looks like from the plugin code
    $( ‘body’ ).on( ‘click’, ‘.wpcf7-field-group-add, .wpcf7-field-group-remove’, function() {});
    would work, but all the rest of my code is vanilla JS.
    Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Felipe Elia

    (@felipeelia)

    Hi Bob!

    First of all, sorry for taking this long to be back to you here.

    As that is a custom jQuery event, unfortunately, you can’t rely on native addEventListener. I guess you could try to monitor changes to DOM using MutationObservers or something like that but that would be a bit hacky.

    Before MutationObservers were a thing, you could use something like

    
document.getElementsByClassName('wpcf7-field-groups')[0].addEventListener('DOMNodeRemoved', function( e ) {
console.log( e );
}, true );

    but today that brings some performance issues.

    I know you told your code is all vanilla JS but jQuery is being loaded anyway (the plugin needs it), so using jQuery there wouldn’t bring any additional code load.

    Thanks!

    Plugin Author Felipe Elia

    (@felipeelia)

    As it’s been more than a month since our last interaction here, I’m marking this topic as resolved. Let me know if you have any additional info or question. Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Capturing button click in JavaScript’ is closed to new replies.