Проверка номера мобильного телефона и текста сообщения

0

Прежде всего, не очень хорошо на PHP и изучать его, пожалуйста, помогите.

Я хочу создать страницу, на которой я принимаю только номер мобильного телефона и текст и отправляю его в process.php для следующего процесса после следующей проверки.

A1- Мобильное поле содержит только цифры (без алфавита, нет '+ или -', no 'comma'). Если в поле содержится какая-либо незначащая цифра, выдается предупреждение "Только числовые значения", удалите поле мобильного телефона и снова сосредоточьтесь на нем.

A2- Мобильное поле допускает только 10 цифр (не менее 10 или не более 10). Если поле содержит меньше или больше 10 цифр, предупредите "Только 10 цифр разрешено", удалите поле мобильного телефона и снова сосредоточьтесь на нем.

A3- Знаки мобильного поля начинаются с 7, 8 или 9 (никаких других начальных цифр, например, от 0 до 6). Если запуск содержит от 0 до 6, выдается предупреждение "Только 7, 8 или 9 при разрешении пуска", удалите поле мобильного телефона и снова сосредоточьтесь на нем.

A4- Если поле "Мобильное" остается пустым, сообщите "Введите номер мобильного телефона".

B1- Текстовое поле проверяет только 160 символов (менее 160 разрешено, но более 160 не разрешено) и отображает поле "символ остается в поле" под текстовым полем.

B2- Если текстовое поле остается пустым, нажмите "Пожалуйста, введите текстовый массаж".

Если все поле "A'-section (для мобильного поля) и" B'-section (для поля текстового массажа) завершено, то поле для полевого и текстового массажа отправляет свои данные в process.php для следующего этапа процесса.

Я работал над этим долго, но все еще нужно больше сделать и правильно организовать его. Пожалуйста, помогите и спасибо заранее

<script language="javascript" type="text/javascript">
// <![CDATA[
function checkNum(x) {
    if (!(/^\d+\d{9}$/.test(x.value))) {
        alert("Only 10 Digits Numeric Values Allowed");
        x.focus();
        return false;
    }
    return true;
}
// ]]>
</script>
<script type = "text/javascript" >
// <![CDATA[
$(window).load(function () {
    $("#tm_field").keyup(function () {
        el = $(this);
        if (el.val().length >= 160) {
            el.val(el.val().substr(0, 160));
        } else {
            $("#charNum").text(160 - el.val().length);
        }
    });
});
// ]]>
</script>
</p>
<p>
    <title>Test Page</title>
</p>
<p><strong>This Free SMS page is still under construction,</strong></p>
<p><strong>M working on it &amp; it will start soon ................</strong></p>
<form action="process.php" method="post">
    <table border="1" align="center">
        <tbody>
            <tr>
                <td><span data-mce-mark="1"><span color="red" style="color: red;" data-mce-mark="1">*</span> Mobile Number </span></td>
                <td>
                    <p><input type="text" name="NUM" id="mn_field" onchange="checkNum(this)" /></p>
                    <p><small> Please enter 10 digits mobile number, only.</small></p>
                </td>
            </tr>
            <tr>
                <td><span data-mce-mark="1"><span color="red" style="color: red;" data-mce-mark="1">*</span> Text Message </span></td>
                <td align="center"><textarea id="tm_field" rows="7" cols="25"></textarea></td>
            </tr>
            <tr>
                <td colspan="1" align="center">Character remain(s)</td>
                <td id="charNum">160</td>
            </tr>
            <tr>
                <td colspan="2" align="center"><input type="submit" value="Bye Bye SMS" /></td>
            </tr>
            <tr>
                <td colspan="2" bgcolor="#ffffcc" align="center"><small><span style="text-decoration: underline;" data-mce-mark="1">N.B.</span><strong> </strong>:- A " <span color="red" style="color: red;" data-mce-mark="1">*</span> " indicates a field is required</small></td>
            </tr>
        </tbody>
    </table>
</form>
  • 0
    Продолжая читать это, я подумал, что должен показать вам более простое направление: Маскированный ввод jQuery Library digitalbush.com/projects/masked-input-plugin
  • 1
    Я хотел бы получить "массаж" для регистрации на вашей веб-странице: D
Показать ещё 4 комментария

1 ответ

0
Лучший ответ

Учитывая ваши требования, я бы написал функцию проверки числа (A) следующим образом:

    var checkMobileNumber = function checkMobileNumber(number) {
            var nonNumeric = /\D+/g,
                indianMobileNumber = /^[7-9]\d{9}$/g,
                allNumeric = false,
                match = false,
                isValid = false,
                message = '',
                error = {
                    "": null,
                    "required": "A mobile number is required.",
                    "invalid": "The mobile number you have entered must start with 7, 8, or 9.",
                    "wrong length": "The mobile number must consist of exactly 10 digits.",
                    "non-numeric": "The mobile number can only consist of numeric values."
                };
        if (number.length !== 10) {
            if (number.length === 0) {
                message = 'required';
            } else {
                message = 'wrong length';
            }
        } else {
            allNumeric = !nonNumeric.test(number);
            match = indianMobileNumber.test(number);
            isValid = allNumeric && match;
            if (!isValid) {
                if (!allNumeric) {
                    message = 'non-numeric';
                } else {
                    message = 'invalid';
                }
            }
        }
        // returning an object containing the overall validity and the error message
        return {
            "isValid": isValid,
            "errorMessage": error[message]
        };
    };

и интегрируйте функцию проверки сообщений на form.submit следующим образом:

    $('form').on('submit', function (e) {
        var errSum = $('.error.summary').empty(),
            num = $('#mobileNumber'),
            sms = $('#smsMessage'),
            smsIsValid = sms.val().trim().length > 0,
            test = checkMobileNumber(num.val()),
            p = $('<p />');
        if (!smsIsValid || !test.isValid) {
            e.preventDefault();
        }
        if (!test.isValid) {
            errSum.append(p.clone().text(test.errorMessage));
            num.get(0).focus();
        }
        if (!smsIsValid) {
            errSum.append(p.clone().text('Please enter a message to send.'))
            if (test.isValid) { // no sense in taking focus away if the mobile number is bad.
                sms.get(0).focus();
            }
        }
        num.siblings('.error').toggleClass('active', test.isValid);
        sms.siblings('.error').toggleClass('active', sms.isValid);
        // normal correct return is below.
        return test.isValid && smsIsValid;
    });

Рабочая демонстрация: http://jsfiddle.net/rawvm/

Вы можете заметить, что рабочая демонстрация "предупреждает" пользователя, добавляя сообщение об ошибке в элемент div вместо вызова alert (это немного более вежливо для ваших пользователей).

ОБНОВИТЬ

Для вашей скрипки просто сделайте:

alert('Wait: SMS Sending...');
return false; // return false to prevent form submission or return true to allow it

последние две строки обработчика validateForm. Обновлена скрипка: http://jsfiddle.net/nDcUT/4/

Однако если вы посмотрите на http://jsfiddle.net/rawvm/, единственное, что вам нужно будет сделать, это изменить текст на "Подождите... отправку SMS" в конце обработчика form.submit.

Вы также можете заметить, что в моей демонстрации я не использую встроенные обработчики JavaScript, и я строго отделяю контент от представления и поведения.

Это хорошая практика, чтобы попасть (и вы можете прочитать множество статей в Интернете об этом). Хорошим для начала является http://robertnyman.com/2008/11/20/why-inline-css-and-javascript-code-is-such-a-bad-thing/

  • 0
    Спасибо U Pete & M очень ценю ваш ответ и помощь. Но в то же время m также решает проблему (и), используя метод проб и ошибок с различными кодами, который включает в себя некоторое оповещение в реальном времени, но я очень признателен, если U позаботится о моем новом коде и поможет мне переставить или сделать его более улучшить (при необходимости). Мне нужно еще одно «предупреждение» «Подождите ... отправка SMS» (зеленым), если все в порядке. Рабочая демонстрация : jsfiddle.net/nDcUT/3 . Пожалуйста, ответьте, я жду ваших указаний
  • 0
    @Worldofgoutam: обновленный ответ.
Показать ещё 24 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню