Forums

Hello,

I have read GreyHead's tutorial for the Multi_Page plugin and it seems pretty straight forward to use, especially considering that the bugs seem to be fixed now.🙂

But I still have a couple of question regarding what's possible to achieve with the plugin:

- Can I avoid page reloading by submitting the form to the server using AJAX? I have used Zapatec Forms with ChronoForms in the past with success (conditional fields), and that's part of the package. http://www.zapatec.com/website/main/products/forms/demo.jsp#zpform/ajax_submit.html

- Can I use conditional submits? It would be similar to Auto insurance forms, where they ask you if you have another car and if you say yes then you have to fill out another page, if not it just moves forward.

If so, do I need to create repeated child forms or can I just create one form that is used over and over?

Thanks in advance to all replies!

Luciano

Hi Luciano,

The answers to your questions are 'Yes' - you can do either of those things, and you don't *need* the multi-page plugin to do either.

It is entirely possible to build complex conditional forms within a single form using PHP and/or JavaScript. ChronoForms has some basic AJAX support built-in if you use the MooTools AJAX functions in combination with the extra code boxes. There is some limited documentation for this in the forums here but it is potentially a very powerful feature.

One of the great strengths of ChronoForms is that it is very versatile - that also makes it potentially difficult to get to grips with all the features.

Bob

PS I'm not sure if a conditional page-skip submission is possible in the basic chronoforms but it probably is with a little added code (you might need to re-write the parameter for the next page number for example).

Hi Bob,

First of all, sorry for not thanking you for your prompt reply, as usual.🙂

I did some research and ended up going with the solution I found on this page:http://home.aland.net/sundman/

It basically uses JQuery to achive the effect I wanted.

So far so good, right? (Come on, you knew I had a question cooking... lol)

The problem I'm having is that it is not executing the "On Submit code - after sending email:", it simply shows a pop up dialog that says "success."

Any ideas where the problem can be? I am using the "On Submit code - after sending email:" not only for a thank you page, but also to confirm the users address and to create a link for a FedEx label (which is generated using the variables from the form.)

Let me know if you need to see any part of the code.

Thanks in advance,

Luciano

From what I've been researching so far, I'm thinking the answer lies with the setup of jquery form.

I found this example on a website:

<script type="text/javascript"> 
     $(document).ready(function() { 
        $('#form1').ajaxForm(function() { 
            location.href=("submitted.aspx");
        }); 
    }); 
</script>

Now, If I'm reading it right, the href is pointing to the file that processes the form. Would I have to create an external PHP file with the code I currently have on the "On Submit code - after sending email:" section or is there a way to point jquery back into Choronoforms?

Like I said, right now when I click the final submit all it does is execute the form wizard submit function, which only brings up a dialogue window... it doesn't execute anything from Chronoforms.

Also, I'm assuming that I'll have to take care of the Jquery fix for Joomla so I don't get any conflicts with Mootools, right? Has anyone tried the SC Jquery plugin http://extensions.joomla.org/extensions/core-enhancements/scripts/7230? I figured it was an easy fix. And now maybe the Jquery Autotab will work... lol

My only question is, if the noConflict method removes the $ operator, how do I call Jquery then?

Thank again in advance for the help!

Wow, no comments at all?

I think I've been spoiled in my previous posts. By now I'm used to have at least a couple of people pitching in...🙂

I'll keep playing with it...

Hi lelias2k,

Sorry, I've been very busy the last few days and this needs a 30 minute reply rather than a 3 minute one or a 30 second one. I will get to it as soon as I have time.

Bob

Sorry Bob, I didn't mean any disrespect with my comment. It was more of a joke than anything.

I was expecting this to be a more in depth problem. After all, it was about time I gave you and this board a real challenge, huh? 😀

Thanks for your support!

Luciano

As an update, I'm not experiencing any jQuery conflicts. And I got the jQuery Autotab to work.

Also, this is what I'm using for the jQuery Wizard:

      $(function(){
        $("#ChronoContact_CEB").formwizard({ 
          //form wizard settings
          historyEnabled : true, 
          formPluginEnabled: true, 
          validationEnabled : true},
         {
           //validation settings
         },
         {
           // form plugin settings
		    url: 'http://localhost/ceb.com/index.php?option=com_chronocontact&task=send&chronoformname=CEB&Itemid=1',
			success: function(data){alert(data.registration.statusMessage);},
			beforeSubmit: function(data){alert("about to send the following data: \n\n" + $.param(data))},
			dataType: 'json',
			resetForm: false
         }
        );
      });

I've added all the items under "form plugin settings" and all I've accomplished with that was to get a dialogue window telling me all the variables it's about to submit and now it won't give me a dialogue box saying "success." (which I'm no sure is a good or a bad sign... lol)

I'll keep you updated, but please let me know if you see something that you think might be the problem.

Thanks!

Well, well, well...

I've uploaded the whole site to my web server (I was testing it on my localhost) and now it's working!

Any suggestions of why it wouldn't work on my localhost? It was working fine before I decided to try and use the jQuery form wizard plugin...

Anyway, now back to fine tuning it.🙂

Hi lelias2k,

No idea why moving to a host would make the difference; some things do change on a host: security settings are a big one; mailer setup; maybe new versions of some files; maybe a different PHP version. But none of these offer me a good explanation.

Bob

I guess I'll just be thankful it's working...🙂

OK, something is not right anymore.

The form is working on Internet Explorer, but it doesn't work on Firefox...

In IE is gives me two errors:

"Object doesn't support this property or method" mootools_1_11.js (This is for the module Gavick News Show GK3)

"Permission denied" jquery-1.3.2.js

Any ideas? Can this be a conflict between jQuery and Mootools?

If so, can you point me to a place where they have a good explanation on how to fix it? I've been to a bunch of sites that have only one or the other side of the explanation...🙂

Thanks in advance.

Luciano

When I just load the page I also get this error:

"Object doesn't suppport this property or method" mootools-yui-compressed.js line:25 Char: 76

This is line 25:

}});Array.extend({forEach:function(C,D){for(var B=0,A=this.length;B<A;B++){C.call(D,this[B],B,this);}},filter:function(D,E){var C=[];for(var B=0,A=this.length;

Again, any ideas?

Sorry for my lack of JS knowledge...

Luciano

OK, I got another clue.

The url parameter for the jQuery form function works when pointing to the localhost address.

      $(function(){
        $("#ChronoContact_CEB").formwizard({ 
          //form wizard settings
          historyEnabled : true, 
          formPluginEnabled: true, 
          validationEnabled : true},
         {
           //validation settings
         },
         {
           // form plugin settings
		    url: 'http://localhost/index.php?option=com_chronocontact&task=send&chronoformname=CEB&Itemid=1',
			success: function(data){alert(data.registration.statusMessage);},
			dataType: 'json',
			resetForm: false
         }
        );
      });

Again, it only works on IE.

However, when I replace localhost for the web server address (keep in mind this is the same address that is on the "action" attribute, which is automatically generated by Chronoforms), it stops working completely.

The mystery remains.🙂

Quick question:

Chronoforms adds &Itemid=1 at the end of the address on the action attribute.

What is that referring to?

BTW, I am sure the problem is with one of the jQuery libraries, as if I don't load them the form works just fine.

I'm trying to narrow down which one it is. Will post back.

And the winner is... jquery.form.js.

Funny thing is, the form works fine apart from a dialogue box asking for the jquery.form.js file.

So that takes me back to the problem being the code controlling jquery.form.js:

      $(function(){
        $("#ChronoContact_CEB").formwizard({ 
          //form wizard settings
          historyEnabled : true, 
          formPluginEnabled: true, 
          validationEnabled : true},
         {
           //validation settings
         },
         {
           // form plugin settings
			success: function(data){alert(data.registration.statusMessage);},
			dataType: 'xml',
			resetForm: false
         }
        );
      });

Hi lelias2k,

MooTools and JQuery are incompatible (I think they both use '$' for different things) but it's possible to configure JQuery so that they will work together. Phil (I think) posted the fix here a month or two ago.

Bob

Yeah, I've been postponing doing the fix for a while...

But at the same time I wonder if that's the problem, since the function seems to be responding to all commands I've been testing.

I think the problem is that the jquery.form.wizard.js file - which I'm relying on to create my AJAX conditional multi-page form, uses the jQuery Form to submit the form. So that's causing a "double submission" kind of problem when combined with Chronoforms.

I've emailed the author of the script asking how to disable the jQuery Form, hopefully he'll reply.

In the mean time, any ideas are welcome.

Sincerely,

Luciano

OK, now I'm getting frustrated...

I have tried all kinds of fixes for jQuery conflict, and I'm still going nowhere.

Also, I still don't think the problem is a conflict, as I'm not getting anymore JS errors on IE. Also, I'm using the jQuery Autotab script and it's working fine. And last, but not least, the form is working (it breaks down the one big form into multiple pages and applies the right conditions when moving back and forward).

I think the problem is that the submit function within the wizard is conflicting with the submission function from Chronoforms.

I have attached the script below, if you have the time to take a look at it.

also, I'm using the following settings:

           // form plugin settings
			success: function(data){alert(data.registration.statusMessage);},
			dataType: 'json',
			resetForm: false
         }
        );
      });

If this doesn't work I see no other choice but to replace Chronoforms. Am I wrong here? Or is this just a matter of digging deeper?

Thanks

Luciano

OK, I just noticed that the file that I attached already uses a jQuery syntax to avoid conflicts. So no more questions on that front.

I just need some help understanding why the form is not being submitted.

Let me know if you want to take a look at the page. I have it uploaded on a test server.

Thanks again

Luciano

Don't you just love when the answer is right on your face?

formPluginEnabled: false, 

And that's it...

I think I've gained a few grey hairs myself... 🤣

Have a great weekend everyone!

Hi lelias2k,

I'm glad that you found that - I was just about to start searching (after coffee though) this morning. :-)

Bob

Thanks Bob!

I'm about to get some coffee myself... celebration coffee that is. 🤣

Have a great wkd!

Luciano