Hi there,

I am building a site that needs some custom Jquery validation. I am looking for optimal way to implement it in my project. I came across a article in ss bits that looks like it is perfect for my needs, but i cant get it to work in SS3. http://www.ssbits.com/tutorials/2009/using-jquery-for-form-validation/

Essentially you load in the jquery 'validate' plugin and then just add the following code to the init function in the page controller. But i cant get it to work. Any thoughts would be appreciated.

I have tried disabling validation by using ' Validator::set_javascript_validation_handler('none');' to do so, but i get the following error:

[User Deprecated] Validator::set_javascript_validation_handler is deprecated. Use custom javascript validation instead.

<b>The validation code looks like this: </b>

Requirements::customScript('
jQuery(document).ready(function() {

jQuery("#Form_CustomerForm").validate({

rules: {
Email: {
required: true,
email: true
},
Tel1: {
required: true,
minlength: 10,
maxlength: 10
}
},
messages: {
Email: "It is quite important that you give me your actual email address so I can send you messages",
Tel1: "The phone number is wrong"
}
});
});
');

are you ensuring that jquery and jquery validation plugin are both being loaded, and before your customScript?

any js errors in your console on the page with the form?

Lastly, I believe SS3 no longer includes custom js validation so there is no need to disable it.

Hi there,

Thanks for the reply.

1) It turns out you are right, i did not have to disable it
2) I had to block the jquery file that ss3 loads automatically from the framework/thirdparty folder
3) Then i added in my own jquery 1.7.1 library
4) Then it worked

I got the latest jquery validation files from here: https://github.com/jzaefferer/jquery-validation

<b> It now looks like this: </b>

public function init() {
parent::init();
//Block old jquery from framework
Requirements::block('framework/thirdparty/jquery/jquery.js');
Requirements::javascript('jobtracker/js/jquery.validate.min.js');

Requirements::customScript('
jQuery(document).ready(function() {
jQuery("#Form_CustomerAdd").validate({
rules: {
Name: "required",
Surname: "required",
StreetAddress: "required",
Email: {
required: false,
email: true
},
Tel1: {
required: true,
number: true,
maxlenth:10,
minlength:10
},
Tel2: {
required:false,
number: true,
},
Tel3: {
required:false,
number: true,
},
Fax: {
required:false,
number: true,
},
DateJoined: {
required: true,
date: true
},
PostalCode: {
required: true,
number: true,
maxlenth:4,
minlength:4
},
},
messages: {
Tel1: "This field is required, only uses numbers and must have 10 digits",
Email: "Please provide a valid email address"
}
});
});
');

}