JQuery проверить группу 3 текстовых входов в один?

Question

У меня есть 3 текстовых ввода для телефонного номера - phone_ac, phone_ex, phone_nm - т.е. 999 555 1212

Я могу использовать jquery для проверки каждого отдельно и выдавать 3 сообщения об ошибках:

"Phone number (area code) is required."
"Phone number (exchange) is required."
"Phone number (last 4 digits) is required."

Можно ли получить одно сообщение об ошибке, только если ЛЮБОЕ из 3 полей не заполнено?

Answer 1

В jquery validate есть параметр 'groups', который делает это.Вы можете включить его в свою проверку и сгруппировать их по их идентификаторам, так что если у вас есть:

 <div>
    <input type="text" id="phone_ac" name="phone_ac" />              
    <input type="text" id="phone_ex" name="phone_ex" />              
    <input type="text" id="phone_nm" name="phone_nm" />   
</div> 

Попробуйте добавить группы для проверки:

$('#yourform').validate({
//...Your existing validation logic...
groups: {
    phoneNumbers: "phone_ac phone_ex phone_nm"
}  
});

Answer 2

Установите параметр errorContainer с элементом, который содержит общее сообщение об ошибке и параметр errorLabelContainer, и оберните errorLabelContainer невидимым элементом контейнера.

Answer 3

попробуй вот так

<script type="text/javascript">
        $(document).ready(function () {

            $('#stay-in-touch').validate({

                highlight: function (element, errorClass) {
                    $('#span1').text("Please enter all the values");
                },
                rules: {
                    text1: "required",
                    text2: "required",
                    text3: "required"
                },
                messages: {
                    text1: "",
                    text2: "",
                    text3: ""
                }
            });
        });


    </script>


    <form method="post" action="Default2.aspx" id="stay-in-touch" >
    <div>
        <input type="text" id="text1" name="text1" /> <br />              
        <input type="text" id="text2" name="text2" /> <span id="span1"></span> <br />              
        <input type="text" id="text3" name="text3" /> <br />   

        <input type="submit" value="submit" />           

    </div> 
    </form>   

Answer 4

Ранее я обрабатывал подобные ситуации, добавив скрытый ввод с именем PhoneNumber и добавив в него обязательные и проверочные флаги. Затем перед проверкой формы установите ее значение для объединения всех трех полей.