CODEWITHSUNDEEP
javascriptjqueryregexvalidationinput
StuyvesantBlue
StuyvesantBlue

Reputation: 145

Restrict text input to number groups separate by a non-consecutive character

I've been doing a lot of searching, chopping and changing, but I'm...slightly lost, especially with regards to many of the regex examples I've been seeing.

This is what I want to do:

I have a text input field, size 32.

I want users to enter their telephone numbers in it, but I want them to enter a minimum of 10 numbers, separated by a single comma. Example:

E.g. 1 0123456789,0123456789 = right (first group is >=10 numbers, second group = >=10 numbers & groups are separated by a single comma, no spaces or other symbols)

E.g. 2 0123456789,,0123456789 = wrong (because there are 2 commas)

E.g. 3 0123456789,0123456789,0123456789 = right (same concept as E.g. 1, but with 3 groups)

I've got the following, but it does not limit the comma to 1 per 10 numbers, and it does not impose a minimum character count on the number group.

$(document).ready(function(){
$("#lastname").keypress(function (e) {

//if the letter is not digit then display error and don't type anything
if (e.which != 8 && e.which != 0 && String.fromCharCode(e.which) != ',' 
&& (e.which < 48 || e.which > 57)) {

//display error message
$("#errmsg").html("Digits Only").show().fadeOut("slow");
return false;
}
});
});

Preferably, I'd like to warn the user of where they are going wrong as well. For example, if they try to enter two commas, I'd like to specifically point that out in the error, or if they havent inserted enough numbers, i'd like to specifically point that out in the error. I'd also like to point out in the error when neither a number or a comma is inserted. I'd like to ensure that the tab, and F5 keys are not disabled on the keyboard as well. And very importantly, I'd like to specifically detect when the plus or addition key is used, and give a different error there. I think I'm asking for something a little complex and uninviting so sorry :/

The example code I provided above works pretty well across all browsers, but it doesn't have any of the minimum or maximum limits on anything I've alluded to above.

Any help would be appreciated.

Upvotes: 0

Views: 85

Answers (2)

Venkat.R
Venkat.R

Reputation: 7736

Try like the below snippet without Regex

var errrorMessage = '';

function validateLength (no) {
    if(!no.length == 10) {
       return false;
    }
    return true;
}

function validatePhoneNumbers (currentString, splitBy) {
    if(currentString) {
        var isValid = true,
            currentList = currentString.split(splitBy);

        // If there is only one email / some other separated strings, Trim and Return.
        if(currentList.length == 1) {
            errrorMessage = 'Invalid Length in Item: 1';
            if(validateLength( currentString.trim() )) isValid = false;
        }
        else if(currentList.length > 1) {
            // Iterating mainly to trim and validate.
            for (var i = 0; i < currentList.length; i++) {
                var listItem = currentList[i].trim();
                if( validateLength(listItem ) ) {
                   isValid = false;
                   errrorMessage = 'Invalid Length in Item:' + i
                   break;
                }
                // else if for some other validation.
            }
        }
    }

    return isValid;
}

validatePhoneNumbers( $("#lastname").val() );

Upvotes: 1

coffee-converter
coffee-converter

Reputation: 977

As far as a regex that will check that the input is valid (1-3 phone numbers of exactly 10 digits, separated by single commas), you can do this:

^\d{10}(,\d{10}){0,2}$

Upvotes: 1

Related Questions