Solved

JQuery addMethod validation

Posted on 2014-04-06
8
490 Views
Last Modified: 2014-04-19
Hi, i am trying to add a new addMethod in jquery validation Plugin so validate the two textfields containing comma separated values must be same

like if textfield1 has 6 values, textfield2 must have 6 values too.

Here is what i have tried so far, but it seems wrong

$.validator.addMethod("sametosame", 
function(value,element) {
    var thing1 = $(element).val().length;
    var thing2 = $(element).val().length; 
    if (thing1 == thing2) {
        return true;
    }
    else {
        return false;
    } 
},'Contents must have same length');

Open in new window

0
Comment
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
8 Comments
 
LVL 75

Assisted Solution

by:Michel Plungjan
Michel Plungjan earned 200 total points
ID: 39982464
You pass one element. You need to get the other elements too.

Please note that this test will be irritating if it is executed on each field as it is filled in.

Try (not tested)

$.validator.addMethod("sametosame", 
  function(value,element) {
    var thisID = element.id;
    var thisPrefix = thisID.replace(/\d*$/, ""); // get "textfield"
    var lengths = $("input[name^='thisPrefix']").map(function() { // get all textfield*'s length
      return this.value.length;
     }).get().join(); // into an array
    // find the smallest and largest length
    var min = Math.min.apply(null, lengths),max = Math.max.apply(null, lengths);
    return (min === max);
},'Contents must have same length');

Open in new window

0
 
LVL 16

Author Comment

by:Gurpreet Singh Randhawa
ID: 39982524
Thanks @mplungjan

I will test it and let you know of the same
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39982609
Typo

 var lengths = $("input[name^='thisPrefix']")

should be

 var lengths = $("input[name^='"+thisPrefix+"']")

assuming the fields you test really do have

xxx1, xxx2, xxx3 as pattern
0
Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 39982757
instead of splitting and joining the strings, which in theory is expensive, you could just count the number of spaces


var numSpaces = function(text) { 
   var result = text.match(/\s+/g).length;
   return result ? result : 0;
}

Open in new window



you may want to  change the expression to not count begging of line or end of line spaces.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39982773
I am not splitting strings.

But I think I have a join() that should not be there


}).get(); // into an array
0
 
LVL 43

Accepted Solution

by:
Rob earned 300 total points
ID: 39984726
Correct me if I'm wrong but aren't you just wanting to know if both textfields have the same number of values, rather than the same length?

eg.

If textfield1 has 44,2,6,1,111,8 (6 values) and textfield2 has 1,2,3,4,5,6 (also 6 values) then the validation is true?

Here is what I mean:
http://jsbin.com/noqoc/1/edit?js,output

$(document).ready(function() {

  $.validator.addMethod("sametosame", function(value,element) {
    var tmp = value.split(",").length;
    var rtn = true;
    $(".same").each(function(index) {
      console.log($(this).val().split(',').length);
      rtn = rtn && ($(this).val().split(',').length === tmp);
    });
    console.log(rtn);
    return rtn;
  },'Contents must have same length');

  $.validator.addClassRules("same", { sametosame: true });
  $("#test").validate();


});

Open in new window

0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39985434
Hmm, my validation tests that the lenght of what has been typed is the same.

I agree we need elaboration on what exactly you are testing - example data would be useful
0
 
LVL 16

Author Closing Comment

by:Gurpreet Singh Randhawa
ID: 40010335
Thanks Guys
0

Featured Post

[Webinar] Learn How Hackers Steal Your Credentials

Do You Know How Hackers Steal Your Credentials? Join us and Skyport Systems to learn how hackers steal your credentials and why Active Directory must be secure to stop them. Thursday, July 13, 2017 10:00 A.M. PDT

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

695 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question