Estoy usando swup.js para la transición de página y cambio de contenido a través de AJAX. Lamentablemente, los formularios de gravedad no parecen manejar bien la solicitud de AJAX y mi formulario no funciona después de la transición.
Estoy usando lo siguiente para reiniciar mis scripts al cargar la página:
document.addEventListener('swup:pageView', (event) => { // code })¿Hay alguna función que pueda reiniciar en javascript para que los formularios de gravedad se reinicialicen en cada transición de página? No se pudo encontrar nada en la documentación.
Sé que la fecha de la publicación es lejana, pero esta pregunta me acaba de aparecer y, en caso de que no puedas encontrar la respuesta,
intente usar este código, esto observará cualquier cambio que se aplique al DOM del cuerpo y activará lo que desee:
<script> $(document).on('DOMSubtreeModified', 'body', function (el) { console.log('body content changed'); // append you init code here }); </script>Dime si esto está funcionando o no.
Terminé usando SwupFormsPlugin y Contact Form 7 con lo siguiente
document.addEventListener('DOMContentLoaded', function (event) { var domain = window.location.origin // HACK: makes link selector relative var isMobile = window.innerWidth < 800 if (isMobile) { } else { var swup = new Swup({ plugins: [ new SwupOverlayTheme({ color: '#eff6fb', duration: 3000, direction: 'to-bottom', }), new SwupBodyClassPlugin(), new SwupFormsPlugin({ formSelector: 'form.wpcf7-form' }), new SwupScrollPlugin({ doScrollingRightAway: false, animateScroll: true, scrollFriction: 0.3, scrollAcceleration: 0.04, }), ], FORM_SELECTOR: 'form.wpcf7-form', LINK_SELECTOR: 'a[href*="'.concat( domain, '"]:not([data-no-swup]), a[href^="/"]:not([data-no-swup]), a[href^="#"]:not([data-no-swup]), a[xlink\\:href]' ), }) swup() } }) function domReady (callback) { document.readyState === 'interactive' || document.readyState === 'complete' ? callback() : document.addEventListener('DOMContentLoaded', callback) } export { domReady }Inicio ayuda a cualquiera