CF6 multi page ajax form custom javascript

Pe Petike1007 15 Jun, 2020

I'm trying to do some Javascript stuff on the second page of multiple page AJAX form but it doesn't run.
I have put custom javascript block in the beginning of second page but can't see it on the page source either.
Any suggestion?

Thanks

Max_admin 15 Jun, 2020

Hi Petike,

What is the JS code supposed to do ?

Max, ChronoForms developer
ChronoMyAdmin: Database administration within Joomla, no phpMyAdmin needed.
ChronoMails simplifies Joomla email: newsletters, logging, and custom templates.

Pe Petike1007 15 Jun, 2020

Hi,
Some DOM manipulation to use floating labels.
I put my code to the template script file which is working until I go to the second page of my form so I tried to put on yhe second page again in chronoforms custom script but doesn't work for me.

he healyhatman 16 Jun, 2020

Whatever functions you call to do that, you will need to call it again after the ajax reloads the content.

Pe Petike1007 16 Jun, 2020

Can you help me how?
I tried ajax functions like ajaxComplete or ajaxSucces events as I thought inside it I can run my functin but it's not running after I going to second apge of the form.
My script works perfectly when ajax is off.

Max_admin 16 Jun, 2020

Answer

1 Likes

Place your functions in page 1, then call them in page 2 using HTML view like this:

<script>my_function();</script>

the "my_function();" should be already defined in page1

Max, ChronoForms developer
ChronoMyAdmin: Database administration within Joomla, no phpMyAdmin needed.
ChronoMails simplifies Joomla email: newsletters, logging, and custom templates.

Pe Petike1007 17 Jun, 2020

That's what I tried, made a function on page 1:
const floatingLabel = () => {
//stuff to do
};

second page I tried with html block:

<script>floatingLabel();</script>

or just simple javascript block:

floatingLabel();

First page works perfectly, second page on the console:
Uncaught ReferenceError: floatingLabel is not defined

he healyhatman 17 Jun, 2020

1 Likes

Do you have DOM Ready ticked on the first one? Because then it would only be available within that block.

Pe Petike1007 17 Jun, 2020

Oh....that was the one. I didn't know that.
Thanks a lot

CF6 multi page ajax form custom javascript

Execute custom JavaScript on a multi-page AJAX form in ChronoForms.

Overview