Anagio
Anagio

Reputation: 3075

jQuery validate single input and require two strings First and Last name

I use a registration form that asks users to enter their full name into one input field. A php class then parses their first and last name and inserts to our db. I just found out our billing system doesn't like receiving just a first name so I have to validate the form field and make sure there are two strings entered. This is a fiddle of a basic input with validation but i'm not to good and writing a rule to check for two strings. Any help would be appreciated

Thanks

http://jsfiddle.net/peter/4X3mx/1/

Upvotes: 1

Views: 8845

Answers (7)

DevNinjaJeremy
DevNinjaJeremy

Reputation: 138

Two words wouldn't necessarily work if the user has a two word last name like "Jeremy Von Morton" or something to that effect. Or if the label says "Full Name" the user might enter their middle name as well. I would display a note to the user that a first and last name is required. I would suggest splitting the name then combining the last two together afterwards in the case of a two or multi word last name. Then there is also the situation where the users first name has multiple words like "Mary Ann". This is usually why the name is split between multiple fields.

Upvotes: 0

This is how I did it:

Note: it will only allow two words, no more, no less.

jQuery.validator.addMethod(
    "withTwoStrings",
    function(value, element) {
            howManyWords = value.trim();
            howManyWords = howManyWords.replace(/\s{2,}/g, ' '); //remove extra spaces
            howManyWords = howManyWords.split(' ');

            if(howManyWords.length == 2){
                return true;
            }
            else{
                return false;
            }
        e.preventDefault();
    },
    "Please Include First and Last Name. Thanks... :)"
);

And in the Rules object:

fieldName: {
      withTwoStrings: true,
},

Note: I don't know Regex, if somebody can do this with Regex, please let me know...

Upvotes: -1

Diogo Rissi
Diogo Rissi

Reputation: 1

the joining ideas from JoseTomasTocino and spicavigo, can be better:

jQuery.validator.addMethod("lastname", function(value, element) { 
    if (/\w+\s+\w+/.test(value)) {
        return true;
    } else {
        return false;
    }
    e.preventDefault();
}, jQuery.format("Please enter the correct value"));

$("#commentForm").validate();
$('#cname').rules("add", {required:true, minlength: 2, method: "lastname"});

Upvotes: 0

spicavigo
spicavigo

Reputation: 4224

Check http://jsfiddle.net/4X3mx/21/ for the solution. I am jQuery noob too so this might not be the best solution.

$(document).ready(function(){
  jQuery.validator.addMethod("twostring", function(value, element) { 
      return value.indexOf(' ') == -1? false: true; 
    }, jQuery.format("Please enter the correct value"));
  $("#commentForm").validate();
  $('#cname').rules("add", {required:true, minlength: 2, method: "twostring"});

});

Upvotes: 0

vdegenne
vdegenne

Reputation: 13270

client side :

if( input.value.split(' ').length == 2 ){
 //your code...
}

server side :

if( count( explode(' ', $_POST['name_field']) ) == 2 ){
 //your code...
}

Upvotes: 1

Geoff
Geoff

Reputation: 9340

if($('#cname').val().split(' ').length >= 2)
{
    ...
}

Upvotes: 2

You could try with:

$(document).ready(function() {
    $("#btn").click(function(e) {
        if (/\w+\s+\w+/.test($("#cname").val())) {
            alert("good");
        } else {
            alert("bad");
        }

        e.preventDefault();
    });

});

Fiddle: http://jsfiddle.net/YrFfG/

Upvotes: 8

Related Questions