[jQuery] jQuery Validate dynamic form issues
Hey all, this is my first post here. I have tried desperately for
hours and hours to find a solution to this problem but so far no
luck.
I have a dynamic form that will show/hide certain parts based on the
value of a select box. I am also using the errorContainer option to
display all errors together in a seperate div.
My problem is that the errorContainer is not hiding itself when there
are zero errors. I suspect this is because the numberOfInvalids is out
of wack with what is actually on the page. I am manually hiding errors
for form elements that no longer exist, which is causing the validate
plugin to become confused. If the validate plugin could validate
onChange of a select box that may help me out, but I haven't found a
way to make that happen.
Instead of writing a book about the issue I will just show you a
working example and maybe someone can help me out. There are 2 files
here, test-1-1.html and test-1-1.js. Not included are jquery and the
validate plugin.
The easiest way to observe the error is: select 1 borrower, click
submit, select 0 borrowers (Please Select)...
//---
test-1-1.js--//
$(document).ready(function(){
// form validation
$(form).validate({
debug: true,
onkeyup: false,
ignore: '.ignore',
rules:{
numBorrowers:{
notZero: true,
},
borrower1FName:{
required: true,
},
borrower1MName:{
required: true,
},
borrower1LName:{
required: true,
},
borrower2FName:{
required: true,
},
borrower2MName:{
required: true,
},
borrower2LName:{
required: true,
},
primaryContact:{
required: true,
},
},
messages:{
numBorrowers:{
notZero: 'Please choose the number of loan
applicants.',
},
borrower1FName:{
required: 'Please enter Borrower 1\'s first
name.',
},
borrower1MName:{
required: 'Please enter Borrower 1\'s middle
name.',
},
borrower1LName:{
required: 'Please enter Borrower 1\'s last
name.',
},
borrower2FName:{
required: 'Please enter Borrower 2\'s first
name.',
},
borrower2MName:{
required: 'Please enter Borrower 2\'s middle
name.',
},
borrower2LName:{
required: 'Please enter Borrower 2\'s last
name.',
},
primaryContact:{
required: 'Please choose the primary contact
for this loan.',
},
},
highlight: function(element){
$(element.form).find(label[for=+element.id +])
.addClass('error');
},
unhighlight: function(element){
$(element.form).find(label[for= + element.id + ])
.removeClass('error');
},
errorContainer: #applicationErrorMessage,
errorLabelContainer: #applicationErrorMessage ul,
wrapper: li,
});
$.validator.addMethod(notZero, function(value){
if(value == 0)
return false;
else
return true;
});
// functions
function borrower1AddValidation(){
$('.borrower1').removeClass('ignore');
}
function borrower2AddValidation(){
$('.borrower2').removeClass('ignore');
}
function borrower1RemoveValidation(){
// remove validation
$('.borrower1').addClass('ignore');
// remove highlighting next to input
$('td label[for^=borrower1]').removeClass('error');
// hide error msgs
[jQuery] JQuery Validate div selector issues
Hi Guys
I am trying to get validate to work, but I am soo close and yet soo
far!
I think the problem is the selector and way i append the error or
valid classes to the label, or specify the element for errors?
Can anyone see the mismatch or problem?
HTML example...
[code]div class=namedivCompany Name:/div
div class=textdiv
div class=inputdivinput name=CompanyName
id=CompanyName
type=text class=input-text/ value=?if(isset($this-
company_name)){ echo $this-company_name;};?/div
div class=inputrightdiv
id=img_CompanyName/div
/div
div class=inputbottom-text
id=error_CompanyName?php echo
$this-error_array['company_name']; ?/div
[/code]
where the inputrightdiv is what holds my todo image,
then i want it replaced with inputrightdiv-valid which shows my nice
green tick image!
Jquery Validation initialization( i have taken out extra options for
simplicity )...
[code]
script
$(document).ready(function() {
// validate signup form on keyup and submit
var validator = $(#recruiter_signup).validate({
rules: {
CompanyName: required
},
messages: {
CompanyName: Please ensure you have entered your
company name.
},
// the errorPlacement has to take the table layout into account
errorPlacement: function(error, element) {
error.appendTo(element.parent().parent());
},
// Set Error Element
errorElement: div.inputrightdiv,
// Focus in textbox
focusInvalid: false,// show all form error at a time
// Set Error Class
//errorClass: error,
errorClass:inputrightdiv-error,
// specifying a submitHandler prevents the default submit, good
for
the demo
submitHandler: function() {
alert(submitted!);
},
// set this class to error-labels to indicate valid fields
success: function(label) {
label.addClass('inputrightdiv-valid');
}
});
});
/script[/code]
thanks for any tips or eagle eyes :)
[jQuery] jquery validate plugin - greaterThan addmethod problem
Hello,
So, I am using two custom methods, GreaterThan and LesserThan:
// custom code to for greater than
jQuery.validator.addMethod('greaterThan', function(value, element,
param) {
return ( value jQuery(param).val() );
}, 'Must be greater than start' );
// custom code for lesser than
jQuery.validator.addMethod('lesserThan', function(value, element,
param) {
return ( value jQuery(param).val() );
}, 'Must be less than end' );
Then, in the validation rules I have:
aupairLongStay: {required:true, greaterThan: #aupairShortStay},
aupairShortStay: {required:true, lesserThan: #aupairLongStay},
I'm trying to use them to test two select boxes against each other...
making sure one is less than the other but it doesn't work properly...
any ideas?
[jQuery] jquery validate bug
Hi, I found a bug within the validation plugin I have a form and I need to click the submit button twice to submit the form. It seems that on the first click validates and only on the second click will submit the form. I think it must submit the form directly if there is no validation error. A small example can be found here http://www.codeassembly.com/files/validate-bug.zip Thanks.
Re: [jQuery] jquery validate bug
I download your code and it's working fine. On Tue, Dec 15, 2009 at 08:48, Givan giv...@gmail.com wrote: Hi, I found a bug within the validation plugin I have a form and I need to click the submit button twice to submit the form. It seems that on the first click validates and only on the second click will submit the form. I think it must submit the form directly if there is no validation error. A small example can be found here http://www.codeassembly.com/files/validate-bug.zip Thanks.
[jQuery] jQuery Validate and Dialog Confirm. submit() not working.
I have a form that is being valdiated with jQuery validate plugin. On
clicking submit, and after form has been succesfully validated, I want
a dialog confirmation to appear, then on clicking OK, the form
submits.
See my code below. The Dialog opens fine. Dialog works fine, but the
form does not submit when OK is clicked.
My guess is the .submit() call is sending the process back into the
validate() process, causing some kind of loop, but I can't think of
any other way to do this.
Any suggestions on what I am doing wrong here will be greatly
appreciated.
===
// Initialize Dialog Box
$('#dialog').dialog({
autoOpen: false,
width: 400,
modal: true,
title: 'Confirm Purchase of Credit.',
close: function() {$('#dialog p').empty();},
buttons: {
Ok: function() {
$(#purchase_credit).submit
();
$('#dialog p').empty();
},
Cancel: function() {
$(this).dialog(close);
$('#dialog p').empty();
}
}
});
// dialog being opened from validate() using the submithandler.
submitHandler: function(form) {
$('#dialog p').append('Click \'OK\' to
confirm Purchase of $' + $(#cc_amount).val() + ' Credit.brbrThis
amount will be charged to the Credit Card
Entered.');
$('#dialog').dialog('open');
}
note this message quoted from j...@oz
[jQuery] jQuery Validate using input type=image
I am validating a form that is submitted by an image input (input
type=image), there are 3 of these inputs which either publish, save or
delete the form details. If I turn javascript off and submit the form
I can pick up the value of the input button used. i.e. request.form
(publish.x) = ?, if I turn javascript on and use the jQuery validate
plugin it does everything excpet pass the value of the button pressed
so I can't detect which button has been pressed. Any help appreciated.
[code]
$(function() {
$(#vml_library).validate({
ignore: input[type=hidden],
rules: {
mName: {
required: true
},
mSummary: {
maxlength: 200
},
mDescription: {
required: true
},
mFile: {
required: true,
accept:
+$(input[name=typeList]).val().replace(/\'/g,
'').replace(/\./g, '').replace(/,/g, '|') +
},
tFile: {
required: function(element) {
return $(input[name=vType]).val() 1;
},
accept: true
}
},
messages: {
mName: {
required: Required
},
mFile: {
required: Required,
accept: Invalid File, must be +
$(input[name=typeList]).val()
},
mSummary: {
maxlength: You may not use anymore than 200
characters
},
mDescription: {
required: Required
},
tFile: {
required: Required,
accept: Invalid File, must be '.jpg', '.jpeg',
'.gif' or '.png'
}
},
success: function(label) {
label.addClass(valid).text(OK!);
},
highlight: function(element, errorClass) {
$(element).addClass(errorInput);
},
unhighlight: function(element, errorClass) {
$(element).removeClass(errorInput);
},
submitHandler: function(form) {
ShowProgress();
form.submit();
}
});
});
[/code]
Re: [jQuery] jQuery Validate using input type=image
The plugin handles that case, though only for type=submit. You could try
using a button instead:
button type=submitimg ... //button
Jörn
On Fri, Nov 27, 2009 at 12:52 PM, Rich reholme...@googlemail.com wrote:
I am validating a form that is submitted by an image input (input
type=image), there are 3 of these inputs which either publish, save or
delete the form details. If I turn javascript off and submit the form
I can pick up the value of the input button used. i.e. request.form
(publish.x) = ?, if I turn javascript on and use the jQuery validate
plugin it does everything excpet pass the value of the button pressed
so I can't detect which button has been pressed. Any help appreciated.
[code]
$(function() {
$(#vml_library).validate({
ignore: input[type=hidden],
rules: {
mName: {
required: true
},
mSummary: {
maxlength: 200
},
mDescription: {
required: true
},
mFile: {
required: true,
accept:
+$(input[name=typeList]).val().replace(/\'/g,
'').replace(/\./g, '').replace(/,/g, '|') +
},
tFile: {
required: function(element) {
return $(input[name=vType]).val()
1;
},
accept: true
}
},
messages: {
mName: {
required: Required
},
mFile: {
required: Required,
accept: Invalid File, must be +
$(input[name=typeList]).val()
},
mSummary: {
maxlength: You may not use anymore than 200
characters
},
mDescription: {
required: Required
},
tFile: {
required: Required,
accept: Invalid File, must be '.jpg',
'.jpeg', '.gif' or '.png'
}
},
success: function(label) {
label.addClass(valid).text(OK!);
},
highlight: function(element, errorClass) {
$(element).addClass(errorInput);
},
unhighlight: function(element, errorClass) {
$(element).removeClass(errorInput);
},
submitHandler: function(form) {
ShowProgress();
form.submit();
}
});
});
[/code]
[jQuery] (Jquery Validate) Keep getting an error in IE8
Hi
I don't know what is going but my jquery validate plugin(1.5.5) is not
working and I am not sure for how long since I do most of my testing
on firefox.
The problem is this I go to one of my forms that jquery validate on it
and hit my create button my validation kicks in as it should and
does this right in all browsers including IE8. Now where it does not
work is when I do this.
I choose the first dropdown list and choose something. Then hit
create now all validation errors should show up expect the one for
the first dropdown box.
It does this in all browsers except in IE 8. I get this
Webpage error details
User Agent: Mozilla/4.0 (compatible;
MSIE 8.0; Windows NT 6.1; Win64; x64;
Trident/4.0; .NET CLR 2.0.50727;
SLCC2; .NET CLR 3.5.30729; .NET CLR
3.0.30729; Media Center PC 6.0; Tablet PC 2.0) Timestamp: Sun, 8 Nov 2009
03:26:08 UTC
Message: Object required Line: 890
Char: 5 Code: 0 URI:
http://localhost:3668/Scripts/Plugins-Development/jquery.validate.js
This is what is on line 890
return options.length 0 ( element.type == select-multiple
|| ($.browser.msie !(options[0].attributes['value'].specified) ?
options[0].text : options[0].value).length 0);
This like the whole method block.
methods: {
// http://docs.jquery.com/Plugins/Validation/Methods/required
required: function(value, element, param) {
// check if dependency is met
if ( !this.depend(param, element) )
return dependency-mismatch;
switch( element.nodeName.toLowerCase() ) {
case 'select':
var options = $(option:selected, element);
return options.length 0 ( element.type ==
select-multiple
|| ($.browser.msie !(options[0].attributes['value'].specified) ?
options[0].text : options[0].value).length 0);
case 'input':
if ( this.checkable(element) )
return this.getLength(value, element)
0;
default:
return $.trim(value).length 0;
}
},
Not sure what is going on.
[jQuery] Jquery validate radio buttons not working
Hi I have been reading the tutorials, posts and forums to figure out
how to get my radio buttons on my form to validate.Everything else in
the form is validating except radio. I am not a developer or coder but
am learning as I go along.
This is what I have done :
I have included validate.js , jquery , and included a jquery
function :
script
$(document).ready(function(){
$(#form).validate();
});
/script
This is my form/radios :
label for=openair
Open Air
input type=radio name=parkingtype id=openair value=open air
validate=required:true /
/label
label for=covered
input type=radio name=parkingtype id=covered
value=covered /
/label
From what I understood , all i required to get this to work was
validate=required:true . However that is not working. Any
assistance on this matter would be greatly appreciated.
[jQuery] [jquery][validate] Locking submit button interferes with validation plugin
This is a question about the jquery Validation plugin. I need to lock the submit button on some forms to prevent multiple submissions, but I don't want to permanently lock it, in case there's a validation problem that the user needs to resolve. I did come up with a way to temporarily lock it and change the text to Saving, Please Wait... for a few seconds, then revert it to an unlocked submit button. The problem I'm having is that this conflicts somehow with the jquery validation plugin. Some fields that have error messages if the user attempts to submit the form with missing data. If I use the temporary locking submit button (which uses an animation to create a duration) then these error messages do not display. Is it possible to test for a validation value in a separate function before running this lock function? If valid, lock, if not valid, don't lock, because it isn't possible to submit an invalid form anyway. I tried wrapping the locking submit function in a setTimeout, but that didn't have any effect at all in delaying it.
[jQuery] [jQuery Validate] How to use on group of two selects
How would I validate this group of two selects: plabel for=expires[]span class=req*/span Expires/label select name=expires[m] option value=MM/option option value=101/option option value=202/option option value=303/option option value=404/option option value=505/option option value=606/option option value=707/option option value=808/option option value=909/option option value=1010/option option value=/option option value=1212/option /selectselect name=expires[Y] option value=/option option value=20092009/option option value=20102010/option option value=20112011/option option value=20122012/option option value=20132013/option option value=20142014/option option value=20152015/option option value=20162016/option option value=20172017/option option value=20182018/option option value=20192019/option option value=20202020/option option value=20212021/option option value=20222022/option option value=20232023/option option value=20242024/option option value=20252025/option option value=20262026/option option value=20272027/option option value=20282028/option option value=20292029/option option value=20302030/option /select/p
[jQuery] (jQuery validate) Remote Custom Message Problem on version 1.5.5
Hi.. I´ve upgraded my validate plugin to the 1.5.5 and I was having a problem: I have an email that needs to be checked if it already exists by ajax, and I was using the Validate Remote Method. In my old Validate version ( 1.5) it works great, but in the 1.5.5 version when I validate the email field it show primary the correct error message ( if it exists): Email n...@nono.com already exists. But if I type another existing email, no matter which one, I get the same message with the same email using the validator.format Email n...@nono.com already exists. I was debugging the code and I´ve found out that in line 932 the 1.5 version was written like that: errors[element.name] = response || validator.defaultMessage( element, remote ); And in the 1.5.5 like that: errors[element.name] = previous.message = response || validator.defaultMessage( element, remote ); So I removed the previous.message and it worked great. Does anyone knows why they added this previous.message to this line? And what exactly it does? Thanks
[jQuery] jQuery Validate -- how to require series of checkboxes when named as array[]
I have a working example of jQuery validate working in the link below.
The newsletter checkbox is required and working. However, the colors
checkboxes are all named as an array ( ex: name=color[] ), and so
the problem lies in the validation code, where it uses the name of the
element to require elements ( ex: newsletter: required ).
$(#testform).validate({
rules: {
// how do i name colors below?
// colors[] ???
// fieldset#color_preference input:checkbox ???
colors: {
required: true,
minlength: 1
},
newsletter: required
},
messages: {
colors: *Required,
newsletter: *Required
}
});
Here is an example:
http://psylicyde.com/misc/jquery-validate/demo/test-checkboxes.php
[jQuery] jQuery Validate -- how to require series of checkboxes when named as array[]
I have a working example of jQuery validate working in the link below.
The newsletter checkbox is required and working. However, the colors
checkboxes are all named as an array ( ex: name=color[] ), and so
the problem lies in the validation code, where it uses the name of the
element to require elements ( ex: newsletter: required ).
==
script
$(#testform).validate({
rules: {
// how do i name colors below?
// colors[] ???
// fieldset#color_preference input:checkbox ???
colors: {
required: true,
minlength: 1
},
newsletter: required
},
messages: {
colors: *Required,
newsletter: *Required
}
});
/script
input name=colors[] id=1 value=1 type=checkbox / label
for=1Red/labelbr/
input name=colors[] id=2 value=2 type=checkbox /
label
for=2Green/labelbr/
input name=colors[] id=3 value=3 type=checkbox /
label
for=3Yellow/labelbr/
input name=colors[] id=4 value=4 type=checkbox /
label
for=4Blue/labelbr/
input name=colors[] id=5 value=5 type=checkbox /
label
for=5Orange/labelbr/
==
Here is an example:
http://psylicyde.com/misc/jquery-validate/demo/test-checkboxes.php
http://psylicyde.com/misc/jquery-validate/demo/test-checkboxes.php
--
View this message in context:
http://www.nabble.com/jQuery-Validatehow-to-require-series-of-checkboxes-when-named-as-array---tp25531286s27240p25531286.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] jquery/validate and jquery.form not playing well
Wondering if anyone know why the 2 plugins (validate and form) would
be causing a problem?
Required fields will not validate when using the form plugin for an
ajaxForm, and the form does not validate when clicking submit, will
even submit empty.
Here is my js code(taken mostly form the examples for the plugins):
$().ready(function(){
//hide the result div - for holding response form php script
$(#result).hide();
//loader spinning image
var loader = jQuery('div id=loaderimg src=images/loading.gif
alt=loading... //div')
.css({position: relative, top: 70px, left: 150px})
.appendTo(#content)
.hide();
//ajaxSubmit options
var options = {
target: '#result',
success: returnHandler
}
//set-up form for ajax
$('#contactForm').ajaxForm(options);
//handle return form php - error or success
function returnHandler(evt) {
$('#result').show();
return false;
}
//ajax event handlers
$(#contactForm).ajaxStart(function(){
loader.show(),$('#contactForm').hide();
}).ajaxStop(function(){
loader.hide();
}).ajaxError(function(){
//ajax error return
});
//validate
$('#contactForm').validate({
submitHandler: function(form) {
$(form).ajaxSubmit();
},
rules: {
firstname: {
required: true,
validaChars: true
},
lastname: {
required: true,
validChars: true
},
email: {
required: true,
email: true,
validChars: true
},
phone: {
required: true,
phone: true,
validChars: true
},
bestTime: {
validChars: true
},
comments: {
validChars: true
}
},
messages: {
firstname: 'please enter your first name',
lastname: 'pleae enter your last name',
email: {
required: 'please enter your email',
email: 'please enter a valid email address'
},
phone: {
required:'please enter your phone number',
phone: 'please enter a valid phone number'
}
}
});
});
[jQuery] [jQuery Validate]Validating for incremental form
I have the form:
form
div id=portion1
... some inputs ...
/div
div id=portion2
... some inputs ...
/div
div id=portion3
... some inputs ...
/div
/form
By default, only #portion1 is visible. If inputs inside it are all
valid, #portion2 will be visible and #portion1 will be hidden, and so
on.
The problem is that jQuery Validate will only validate the whole form,
so something like $('#portion1').validate().form() won't work.
So, is there a way to achieve this?
Thanks.
[jQuery] jquery validate and datepicker.
For some reason, and this is baffling me, if I use both the validation plugin and the datepicker plugin, some voodoo is occurring. I have to select the date twice for it to validate. For example, here are the steps I took: I try to submit the form without dates in the fields. The form is not sent and the date fields are flagged. If you open it once and select a date, the calendar closes, but it still shows as invalid. If you repeat this action, selecting the same exact field and opening the calendar and selecting the date again, then it shows as valid. I'm not sure how to shoehorn this into validating on the first click on the calendar. And to be honest, I'm terrified I'm going to get flamed over this. I generally consider myself pretty resourceful, but this is making me a little bit loco.
[jQuery] jquery validate submit character set error
I have this form that shows up on http://www.bspmedia.eu/inspiration.html by clicking on the last paragraph. type a message with for example testöäå and then hit the submit button. On submit the form validates and then sends the mail. But it sends this message as testöäå. If I look in firebug, jquery seems to send the right values (öäå), but somehow it ends up messy in the response script. I have been testing and searching and looking for a while now but cant figure it out. I think the problem is in the fact that jQuery form doesn't translate these characters in a proper way. What it should do (in my opinion) is translate the values ä to for example %36 (or whatever the equivilent may be), so that php can pick it up and translate it with the function urldecode. There is a function in jQuery form that does about that but then all the fields are put as one long string (as it was a GET query). But i want the script to submit with POST. You can download my code at: www.bspmedia.eu/includes/contact-form.txt (the javascript that handles the submision is at www.bspmedia.eu/includes/myContactForm.js )
[jQuery] jquery validate
Hello,
I am using jquery validate on one of my pages with a submit handler,
Can anyone let me know how I can specifiy which layer should contain
the error messages?.
Here is the code I want to change:
$(document).ready(function(){
jQuery(function() {
var v = jQuery(#PropertyForm).validate({
submitHandler: function(form) {
$.ajaxSetup({dataType: html})
$.get('submit.php',{URLLINK:$('#name').val(),rand:Math.random() },
function(datanew) {$('#jim').append(datanew);
});
return false;
}
});
});
});
Here is code I use on other pages to show the messages in the
container:
script type=text/javascript
$(document).ready(function(){
var containerRegistration = $('div.containerRegistration');
var validator = $(#PropertyForm).validate({
errorContainer: containerRegistration,
errorLabelContainer: $(ol, containerRegistration),
wrapper: 'li',
meta: validate
}
);
});
/script
Can anyone help me with the syntax for putting the container into the
first block of code?
Thanks
James
[jQuery] JQuery [Validate plugin] - Placement of error text
Hi all, I am using the jquery form validation plugin (http://docs.jquery.com/ Plugins/Validation) to get some simple validation done on my form. It's working perfect so far. When I set a particular form field to have the class required that makes it so that it can't be blank and when the user tries to submit the form, JQuery displays a This field is required. text beside the field and focuses on it. The text generally appears right beside the input element. I was wondering whether it is possible to actually control where the error text appears? Say like I set an element div element which I want the error to appear. Is there a way to make it the error text appear in that div element? Thanks!
[jQuery] jquery validate remote() - display returned message.
In the documentation for the remote option of the jquery valdiate plugin, it says the remot script can return true, false etc. or a string, eg. That name is already taken, try peter123 instead to display as the error message. What I cannot work out is how to actually display the the message returned by the remote script as the error message for that field. Does anyone know how this is done? Thank you in advance. Jason
[jQuery] jquery(VALIDATE)
I need a way to debug what is being returned when I use the REMOTE
option. I cant get the validation to give me an error class when a
duplicate is found. here is my lookup.php which works perfectly fine
when I use jquery $get to call it.
Lookup.php
?
$noheaders = true; //prevents config.php from loading any header
data such a scripts and styles.
include(config.php);
$table = $_GET[table];
$key = $_REQUEST[key];
$value = $_REQUEST[value];
$failmsg = (isset($_GET[failmsg]) ? $_GET[failmsg] : $value.: Not
Found in TABLE: .$table. for KEY: .$key);
$foundmsg = (isset($_GET[foundmsg]) ? $_GET[foundmsg] : $value.:
Found in TABLE: .$table. for KEY: .$key);
$sql=SELECT * FROM $table WHERE $key='$value' ;
$result=mysql_query($sql);
if (mysql_num_rows($result) 0) {
echo $foundmsg;
} else {echo $failmsg; };
?
Here are my rules:
var validator = $(#myform).validate({
rules: {
username: {
required: true,
minlength: 4,
type: GET,
remote:
lookup.php?table=membersfailmsg=truefoundmsg=false
},
password: {
required: true,
minlength: 5
},
email: {
required: true,
email: true,
type: GET,
remote:
lookup.php?table=membersfailmsg=truefoundmsg=false
}
},
messages: {
Thanks,
Mike
[jQuery] jQuery [validate] - Validating the same form twice
OKay, I'm trying to setup my site to be all on one page with a login/
logout button.
When the user clicks Login, a hidden div with my form in it is
displayed. Once they login successfully, Login becomes Logout.
When they click Logout, it goes back to showing Login, and then
they can click it to show the form again.
The problem is when they click Login the second time, and submit the
form, I get an error:
$.data(element.form, 'validator') is undefined
This is what my code looks like now (simplified):
function loginDone(data) {
$('#login-link').fadeOut('fast', function() {
$('#logout-link').fadeIn('fast');
});
}
$(document).ready(function() {
loginFormVal = $('#loginForm').validate({
submitHandler: function(form) {
$(form).ajaxSubmit({
dataType: 'json',
success: loginDone
});
}
});
});
[jQuery] jquery Validate - send email failing
Wondered if anyone could help out. my form is set up to send an email on submission, and is working correctly. But when i add the validation, the redirect to the 'thank you' page works but no email is sent. Thanks for your help
[jQuery] jQuery validate not firing with 'Enter' button
Hi all, I am new to jQuery, i have problem with validations in my submit form. Problem was when i open add user form, with out entering any details in my add form - when click on my save button all the validations are firing correctly but when i enter any character in any of the field and press enter from keyboard - the validations are not fired. One more thing to inform - this was working fine with chrome browser but not working with Firefox and IE. I am using Jquery + asp.net. Please help me out on this issue as this is little urgent, i can provide you the code if required. Thanks in advance.
[jQuery] [jQuery Validate] One error message for multiple invalid elements
Hello I'm using the jquery validate plugin from bassistance.de. In my
form I have 3 select (day, month and year) to determine the birth date
of the user (the 3 inputs are used as independent fields). My problem
is that when I validate it, if the user has not entered the day, month
of year, I get obviously 3 error messages, and I need to display a
unique error message for the 3 select elements.
I have created a span id error_date and I'm using this code to place
the messages after the year select, I just need to show it once:
errorPlacement : function(label, element) {
if (element.attr(id) == day || element.attr(id) ==
month ||
element.attr(id) == year) {
label.appendTo(#error_date);
} else {
label.insertAfter(element);
}
},
I have tried with label.html(#error_date) with no results.
Thanks in advance
Regards
Daniel
[jQuery] JQuery [validate] plugin - how to disable the validation for an specific button
Hi, I'm using jquery validation with asp.net. The problem is, I have the search button and the comments button in the same form. When the users want to write a comment, the validation works perfect, but when the users want to make a search in the page, the required fields of the comments doesn't allow them. So the question is how can I disable the validation for an specific button. Thanks
[jQuery] Jquery [Validate plugin], validate without submit button
Im having trouble to validate my form because I'm missing a submit
button inside the form, I submit my form by another link outside the
form.
a href=# onclick=document.validateThis.submit(); return
false;save/a
form id=validateThis name=validateThis method=POST action=
input type=text name=name value=/
...
/form
Because I dont have a submit in my form the javascript doesnt get
triggered I suppose, when I place a submit button in my form
everything works just fine, btw the form also gets submitted when
clicking on my a href.
How can I fix this? The javascript is just the basic example
$().ready(function() {
// validate the form when it is submitted
$(#validateThis).validate();
});
[jQuery] jQuery validate, need to require subset of fields with same name
This is regarding use of jquery validate plug-in. I have ten fields of type=file with name=thumbs[] I have added class=required to the first three, but does not give the intended result. obviously i'm trying to require the first three of the ten possible thumbnails image uploads. how do i accomplish this? does jquery validate work with #id selectors? Many thanks Jason
[jQuery] jquery validate plugin. remote problem
Hi, I'm sorry to bother, but I can't find enough documentation on this
plugin
I have this cose:
$(document).ready(function(){
$(#form_reg).validate({
rules: {
username: {required:true, minlenght:5,
remote:check_user.php},
password: {required:true, minlenght:5},
password2: {equalTo: #password},
email: {email:true}
}
});
});
Which works, exept that it throws this error: $.validator.methods
[method] is undefined
Also remote doesn't seems to work. And also: what kind of request does
it? From the scarce information I got to understand that it make a GET
with the name of the field and the value (in my example:
check_user.php?username=xyz)? Is this right?
[jQuery] [JQuery][Validate][Metadata] Custom error message.
Hello.
I have code like this:
INPUT TYPE=CHECKBOX id=suffix_{0} NAME=suffix[] value={1}
validate=required:true,minlength:2
I'm using Validate with Metadata.
How can I add custom validating error message for this field?
Thanks in advance.
[jQuery] jquery Validate
Hello,
I am using the validate plugin and displaying the errors using
grouping technique. Works fine, and I get a single error message at
the end of it.
text: text1 text2 text3 text4
},
errorPlacement: function(error, element) {
if (element.attr(name) == text1 || element.attr(name) ==
text2 || element.attr(name) == text3 || element.attr(name) ==
text4 )
{
error.insertAfter(#text4);
}
else
error.insertAfter(element);
}
text1,text2,text3,text4 are 4 text boxes.
Now, when I go and edit a text box with error, the error message for
others disappear too. Can anybody tell me how I could go about it.
[jQuery] jquery validate
hello I want to validate an input field so he accepts numeric value greater than 20 .. person type number is less than 20 open an alert is to do this with jquery?
[jQuery] jquery validate issues with IE
Hi, I'm sorry if this is a double post but I can't find the original one. I'm having problems with jquery-validation on IE. It's working fine in every other browser. This is the page: http://www.thecentroexperience.com/de/wellness/contest/28/ It should validate all the fields, but in IE it won't allow the form to be submitted, even after the inputs have been filled. Can anyone please check my code and see if I'm missing something? If you submit the form, please use Test and t...@test.com as name and e-mail. Thank you! Frederico
[jQuery] jquery-validate issues with IE
Hi, I have been looking for an answer, but for the love of God, can't find any solution. I have the validator working perfectly on FF and Safari, but can't get it to work on IE. It's giving me a serious headache, but I'm sure I'm missing something obvious. This is the page I'm talking about: http://www.thecentroexperience.com/de/wellness/contest/28/ If you click on 'MITMACHEN' it should give you errors on the right side of the inputs. It works fine in FF but IE just displays the errors and when I start typing, the errors won't go away, thus the form doesn't submit. Can someone please look at the code and figure out what's wrong? If you submit, please use Test and t...@test.com for name and e-mail. Thank you!! Frederico
[jQuery] [jQuery][validate] plugin fails on Safari
Hi Folks,
Wondered if anyone could help on this, I've been stuck on it for quite
some time.
I'm trying to validate a date field using a UK date, here's my code:
$(document).ready(function(){
$('#arrival-arrival-date').datepicker({ minDate: new Date
(),defaultDate: +1,dateFormat: 'dd/mm/yy',constrainInput: false });
$.validator.addMethod('ukdate', function(value,
element) {
var regex =
/^(0[1-9]|[12][0-9]|3[01])[\/](0[1-9]|1[012])[\/]
((19|20)\d\d)$/;
console.log(value.match(regex));
return this.optional(element) || value.match(regex);
}, Please specify a UK date);
// validate signup form on keyup and submit
$(#theForm).validate({
debug:true,
errorClass:
'redBorder',
rules: {
'arrival-arrival-date': {
ukdate: true},
'arrival-stay-duration': {
required: true,
min: 1}
},
highlight: function(element, errorClass) {
$(element).fadeOut(function() {
$(element).fadeIn()
})
},
messages: {
'arrival-arrival-date':'',
'arrival-stay-duration':''
},
highlight: function(element, errorClass) {
$(element).addClass(errorClass);
},
unhighlight: function(element, errorClass) {
$(element).removeClass(errorClass);
},
errorPlacement: function(error, element) {
error.appendTo('errorNotes');
}
});
And you can see a demo of it in action at
http://dev.letsbookrooms.co.uk/uk/perthshire/parklandshotel/. It
works fine on IE, Opera and FF, fails in Safari for any dates where
the dd part is higher than 12.
I think it must be an issue with the validator plugin as I've tested
the regular expression on its own in Saari and it works fine.
Cheers
George
[jQuery] JQuery validate remote call allows form submission before call returns
I believe I'm having a sync issue with the remote validate option. The sample form can be found at www.apylon.com/dagangnet. Basically, the issue is that the captcha is set up for remote validation, but before the result can be returned, the form can be submitted. How do I force the form to not submit until the value is returned from the remote call? Thanks
[jQuery] jquery validate error
Hello,
this is my first post - hope everthing goes fine :-)
today I get a strange error trying to use the validation plugin from
bassistance - used it several times before but never mentioned
something like this (using latest v.1.5.1 jquery 1.3.1).
Firebug shows me following error (my code follows at the end):
validator.settings[on + event.type].call is not a function
The error isn't shown if I remove the event options
(onfocusout,onkeyup..) but I want to use the options of course. Also
the blur event doesn't worked for me any more. I've tried for a few
hours to change my code - e.g. remove the livequery optin - but
nothing worked for me.
Maybe someone has an idea.
thx kind regards
$(document).ready(function()
{
var formOptions =
{
focusInvalid: false,
onfocusout: true,
onkeyup: true,
errorElement: span,
submitHandler:
function(form)
{
$(form).ajaxSubmit({
dataType: json,
beforeSubmit: function(a,f,o) {
o.dataType = html;
$(#ajaxLoad).show();
},
success: function(data){
$(#ajaxLoad).hide();
}
});
},
rules: {
project[title]: {required: true}
},
messages: {
project[title]: {required: 'nbsp;'}
}
};
var validator = $(#project).livequery(function(){
$(this).validate(formOptions);
});
});
[jQuery] jquery validate rules using css for dynamic controls
Hi,
In my application, controls are generated dynamically. I want to know
if I can configure rules by giving CSS classes and NOT by specifiying
element name while validating the fields.
I tried following code and works in some scenarios:
var isValid = $(#questionAnswerForm).validate({
errorLabelContainer: #messageBox,
wrapper: li
});
if(isValid != null !isValid.form()){
return false;
}
I am using struts controls like html:radio, html:text etc. If I
specify error message in title and class=required then works for
radio, text,textarea.
But how can I configure rules in this situation for e-mail, date,
number, checkbox, fileupload control, matrix control fields? Can I
specify CSS class in rules under validate() ?
[jQuery] jquery Validate on page load
Is it possible to validate a form that is populated with data from a database on page load before the user clicks on anything? thanks
[jQuery] jQuery Validate plugin with cake php form won't submit
I am using the jQuery Validate plugin with a form in cakePHP. When I click submit the form is validated but not submitted to the server. When I change the form name From user to user1 it submits properly so it seems that once the form is bound to the javascript it stops submitting the data. any thoughts on how I could get this to work?
[jQuery] jQuery Validate and Show/Hide problems
I am using jQuery show/hide functions on click, so when you click on the contact link it hides that div and then shows a contact form. Once you fill in the contact form and click submit it shows the thanks page div. I am using validation from here: http://bassistance.de/jquery-plugins/jquery-plugin-validation/ The problem is, is that I need it so when you click on submit on the contact form page it doesn't show and hide the div if the validation has failed as it does now. Is there anyway of making it so that I can only click the submit button or show hide the divs if validation is passed? Thanks
[jQuery] Jquery Validate Dependency Callback Error Message?
I need to make sure that 1 field os less than the other so I am using
the dependency callback feature and it's working but I cannot get an
error message to display - anyone get this to work?
Here is my code:
$(document).ready(function(){
$(#AddPartner).validate({
rules: {
GlobalDiscount: {
required: function(element) {
if ($(#GlobalDiscount).val() = 20) { alert('passed');
return true } else { alert('falied'); return false }
if ($(#GlobalDiscount).val() = $
(#ComissionSplit).val()) { alert('passed'); return true } else
{ alert('falied'); return false }
}
},
ComissionSplit: {
required: function(element) {
if ($(#ComissionSplit).val() = 20) { alert('passed');
return true } else { alert('falied'); return false }
}
}
},
messages: {
ComissionSplit: { dependency: Comission plit must be less
than 20 },
GlobalDiscount: { dependency: Global Discount must be less
than your Comission Split}
}
});
});
[jQuery] JQuery validate problem
I have a problem.where i use the jquey validate plugin for my project. I want to use the validate like this: s:textfield id=name name=userGroup.name/ but it does not work . i should make the id and name property as same. or named the id as cname and name is name if i use the struts2 framework and want to use name like xxx.yyy,what can i do to resolve this situation? 3x
[jQuery] jQuery validate error
Hello all,
I'm using jQuery 1.2.6 and Validation 1.3, and I'm getting an error
message in my firebug console when I click (for the first time) any
field in my form.
Error:
validator is undefined
/js/jq/jquery.validate.js
Line 291
My jQuery code is as follows:
$(document).ready(function(){
// There is a bunch of other code here that inits animations on the
page and stuff.
$(#errorDiv).hide();
$(#submitGame).validate({
rules: {
submitGame[creator]: {required: true},
submitGame[gameTitle]: {required: true},
submitGame[gameSummary]: {required: true},
submitGame[gameDetails]: {required: true}
},
messages: {
submitGame[creator]: {required: You must specify if you are
the creator personally or the leader of a team.},
submitGame[gameTitle]: {required: Please enter the title of
your game.},
submitGame[gameSummary]: {required: Please enter a summary of
your game.},
submitGame[gameDetails]: {required: Please enter the details
of your game.}
},
errorContainer: #errorDiv,
errorLabelContainer: #errorDiv ul,
wrapper: li,
submitHandler: function() { alert(Submitted!) }
});
});
I've tried rolling jQuery back each version to 1.2.2 with it throwing
the same error. Any ideas?
Thanks!
Sam
[jQuery] jQuery validate error
Hello all,
I'm using jQuery 1.2.6 and Validation 1.3, and I'm getting an error
message in my firebug console when I click (for the first time) any
field in my form.
Error:
validator is undefined
/js/jq/jquery.validate.js
Line 291
My jQuery code is as follows:
$(document).ready(function(){
// There is a bunch of other code here that inits animations on the
page and stuff.
$(#errorDiv).hide();
$(#submitGame).validate({
rules: {
submitGame[creator]: {required: true},
submitGame[gameTitle]: {required: true},
submitGame[gameSummary]: {required: true},
submitGame[gameDetails]: {required: true}
},
messages: {
submitGame[creator]: {required: You must specify if you are
the creator personally or the leader of a team.},
submitGame[gameTitle]: {required: Please enter the title of
your game.},
submitGame[gameSummary]: {required: Please enter a summary of
your game.},
submitGame[gameDetails]: {required: Please enter the details
of your game.}
},
errorContainer: #errorDiv,
errorLabelContainer: #errorDiv ul,
wrapper: li,
submitHandler: function() { alert(Submitted!) }
});
});
I've tried rolling jQuery back each version to 1.2.2 with it throwing
the same error. Any ideas?
Thanks!
Sam
[jQuery] jQuery validate error
Hello all, I'm using jQuery 1.2.6 and Validation 1.3, and I'm getting an error message in my firebug console when I click (for the first time) any field in my form. Error: validator is undefined /js/jq/jquery.validate.js Line 291 My jQuery code is as follows: [looks like i have to paste bin my code to let google post it 8| Please check this link: http://pastebin.com/m79705300 I've tried rolling jQuery back each version to 1.2.2 with it throwing the same error. Any ideas? Thanks! Sam
[jQuery] jQuery validate error
Hello all,
I'm using jQuery 1.2.6 and Validation 1.3, and I'm getting an error
message in my firebug console when I click (for the first time) any
field in my form.
Error:
validator is undefined
/js/jq/jquery.validate.js
Line 291
My jQuery code is as follows:
$(document).ready(function(){
// There is a bunch of other code here that inits animations on the
page and stuff.
$(#errorDiv).hide();
$(#submitGame).validate({
rules: {
submitGame[creator]: {required: true},
submitGame[gameTitle]: {required: true},
submitGame[gameSummary]: {required: true},
submitGame[gameDetails]: {required: true}
},
messages: {
submitGame[creator]: {required: You must specify if you are
the creator personally or the leader of a team.},
submitGame[gameTitle]: {required: Please enter the title of
your game.},
submitGame[gameSummary]: {required: Please enter a summary of
your game.},
submitGame[gameDetails]: {required: Please enter the details
of your game.}
},
errorContainer: #errorDiv,
errorLabelContainer: #errorDiv ul,
wrapper: li,
submitHandler: function() { alert(Submitted!) }
});
});
I've tried rolling jQuery back each version to 1.2.2 with it throwing
the same error. Any ideas?
Thanks!
Sam
[jQuery] [jquery validate] Validating disabled inputs
Hi, I have a problem with disabled input when I try to validate them. I use class=required but the validation plugin doesn´t detect when is empty. Any idea?
[jQuery] jquery validate, addMethod strange behaviour
Hi there,
I have two issues here:
a) When adding a method to the validator the message does not return
on an error
b) Even though the added method returns false the submit handler still
submits the form.
Any suggestions?
Here the code:
$.validator.addMethod(userExists, function(value, element) {
var r = true;
var jqe = $(element);
jqe.parent(td).next().children(div).empty().append('nbsp;img
src=images/validate_loader.gif width=16 height=16 /');
$.get(ajaxindex.php?module=validateaction=username,
{ username: value },
function(data){
if(data==false) {
jqe.parent(td).next().children(div).empty().append('nbsp;b
class=error-style*/b');
jqe.focus();
r = false;
} else {
jqe.parent(td).next().children(div).empty().append(' nbsp;
');
}
});
return r;
}, The username already exists.);
$.validator.addMethod(emailExists, function(value, element) {
var r = true;
var jqe = $(element);
jqe.parent(td).next().children(div).empty().append('nbsp;img
src=images/validate_loader.gif width=16 height=16 /');
$.get(ajaxindex.php?module=validateaction=email,
{ email: value },
function(data){
if(data==false) {
jqe.parent(td).next().children(div).empty().append('nbsp;b
class=error-style*/b');
jqe.focus();
r = false;
} else {
jqe.parent(td).next().children(div).empty().append(' nbsp;
');
}
});
return r;
}, The email address already exists.);
$(#register_form).validate({
errorLabelContainer: $(#error_li),
wrapper: li,
rules: {
reg_username: {
required: true,
minLength: 4,
maxLength: 120,
userExists: true
},
reg_password: {
required: true,
minLength: 4
},
reg_confirm_password: {
equalTo: #reg_password
},
reg_email: {
email: true,
required: true,
emailExists: true
}
},
messages: {
reg_username: {
required: A valid username is
required.,
minLength: Please enter a username at
least 4 characters long.,
maxLength: Please enter a username no
longer then 120
characters long.
},
reg_password: {
required: A password is required.,
minLength: Please enter a password at
least 4 characters long.
},
reg_email: {
required: A valid email address is
required.
}
},
submitHandler: function(form) {
$(form).ajaxSubmit(options);
}
});
Thanks for the help.
Thomas
