Ajax Help

[dmcnzl]

Hi all, im trying to get a contact form to run using ajax (jquery) the sample can be seen at ....http://www.alliedwatersystems.co.nz/devset/ i have it working in a standalone page fine but inside the cms its just directing to the form handler.

I have the form itself in a global block and am including the js/css required to run it from the template within the cms. the included js that handles the layers/vars being passed through can be viewed at...http://www.alliedwatersystems.co.nz/devset/index_files/contact_ajax.js

any advice would be much appreciated. im stumped as to why it wont work.  when i had the above js included within the page itself the code was cut down presumably by the cms on rendering the page so does anyone know why that would be? im an experienced programmer but am new to this cms so would love some help.

Thanks in advance.

regards

Dan


ps the test version that works can be seen here...http://www.alliedwatersystems.co.nz/devset/test.php this is a standalone copy of the page not part of a cms.

[NaN]

First of all the test version you said that "works" returns this error message:

Code: Select all

Warning: Invalid argument supplied for foreach() in /home/alliedwat/alliedwatersystems.co.nz/devset/contact_ajax.php on line 33

Second thing is your site isn't valid.
Labels for inputs refers to nonexistent ids.
Duplicate usage of ids.
Empty Elements without trailing "/>".
etc.
But this is not the reason why your form does not work properly.

Are you sure you understood well how to use jQuery or javascript at all?
Because in your script you refer to a form with the id "contactForm":

...

//trigger ajax on submit
$('#contactForm').submit( function(){

...

But in your HTML output there is no such form.
This is why the submit handler doesn't work.
The id of your form is:

So how is the form created?
If it is created by a module of CMSms the id might be generated dynamically by the cms.
So it would be better to use another method to set the form submit handler.
That means not to refer to the id of the form (because it may change) but to the id of the div that contains that form and telling jQuery to find the first form inside that div.
E.g.:

Code: Select all

	...

	//trigger ajax on submit
	$("#container form:first").submit( function() {
	
	...

Hope that helps.

[NaN]

If this is solved, please edit your first post and add (SOLVED) to the subject.