Gereltod
Gereltod

Reputation: 2234

Input number list with jQuery

I'm making some work, but there are 3 issues still I have. I tried many ways, but nothing useless. If you know jQuery enough, please suggest me some changes.

First please view below URL:

http://jsfiddle.net/thisizmonster/maP57/

What am I doing is:

  1. User will input phone number.
  2. Number will be only 8 char length.
  3. Number must begin with 9 or 7. Means 9xxxxxxx or 7xxxxxxx.
  4. User can enter maximum 3 numbers.
  5. Numbers must seperate with comma.

Current problem is:

  1. There mustn't any comma after numbers. Only between numbers.
  2. Validate numbers with 9xxxxxxx or 7xxxxxxx format while writing.
  3. They can't enter continues commas. I mean ",," don't allow.

If you can't see example on jsfiddle, here is copied version:

HTML

<input type="text" id="sms-sender" />

JS

$(document).ready(function() {

$("#sms-sender").keypress(function(event) {
    var numbers = $("#sms-sender").val().split(',');
    var maxMsg = 3;

    if (event.which != 44 && (event.which < 47 || event.which > 59) || numbers.length > maxMsg) {
        event.preventDefault();
    }
    if (numbers.length > maxMsg) {
        event.preventDefault();
    }
    if (event.which == 44) {
        if (numbers.length <= maxMsg) {
            $("#number-div").html("");
            for (i = 0; i < numbers.length; i++) {
                $("#number-div").append("<div class='numbers'>&nbsp;"+numbers[i]+"</div>").fadeIn('slow');
                if (numbers[i].length != 8) {
                    $("#number-div").append("wrong")
                }
            }
        }
    }
    if (numbers[numbers.length - 1].length > 7) {
        if (event.which != 44) {
            event.preventDefault();
        }
    }
});

});

Upvotes: 3

Views: 884

Answers (3)

Corneliu
Corneliu

Reputation: 2942

/^[79]\d{7}(,[79]\d{7}){0,2}$/.test($("#sms-sender").val())

Upvotes: 0

DarkLeafyGreen
DarkLeafyGreen

Reputation: 70426

2. use keyup to validate numbers while typing http://jsfiddle.net/2n7Tf/1/

$('#sms-sender').keyup(validateNumber);

1. & 2. for the other stuff you can use regular expressions. But I am not sure what you mean with the comma. Please explain that.

/^[0-9]+$/.test(number)

will return true if number matches the regular expression. So here you go: http://jsfiddle.net/2n7Tf/4/

if(/^([0-9]+,)*[0-9]+$/.test($('#sms-sender').val())){
    alert("match!");
}

Upvotes: 1

Billy Moon
Billy Moon

Reputation: 58561

Using regular expressions to state, 9 or 7 ([97]) followed by 7 digits and a comma (\d{7},) 0 to 2 times ({0,2}) covers everything before the number you are currently writing which in turn is covered by 9 or 7 ([97]) followed by 0 to 7 digits (\d{0,7}) all optionally (?).

http://jsfiddle.net/xTRph/

html:

<input type="text" id="sms-sender" />

javascript:

var lastGood = ''
$("#sms-sender").bind('keyup',function(e){
    if(!$('#sms-sender').val().match(/^([97]\d{7},){0,2}([97]\d{0,7})?$/))
        $('#sms-sender').val(lastGood)
    else
       lastGood = $('#sms-sender').val()
});

Upvotes: 1

Related Questions