jQuery Проверить ошибки не отображаются из-за вложенных div? - PullRequest
1 голос
/ 08 февраля 2012

Я пытаюсь использовать jQuery с плагином Validate, за исключением того, что не могу отобразить свои ошибки. Ниже приведен код, который я использую. Я прочитал документацию, и не могу сказать, если это потому, что .validate настроен неправильно, или это связано с тем, что мои ошибки находятся в нескольких делениях от макета CSS. Заранее спасибо за помощь.

<script type="text/javascript">
$(document).ready(function() {
    $("#order_form").validate({
        debug:true, 
        errorContainer: "#errors",
        errorLabelContainer: "#errors ul",
        wrapper:"li",
        onsubmit:true,
        rules: {
            business_name: {
            required: true
        }

    },
    messages: {
        business_name: {
            required: "Please enter a valid business name or select &quot;Individual&quot; from above"
        }
    }
});

});
</script>
</head>
<body>

<div id="wrapper">
<div id="logo">
    <img src="images/RPP7.png" />       
</div>
<div id="menu">
    <ul>
        <li class="current_page_item"><a href="index.html">Home</a></li>
        <li><a href="about.html">About</a></li>
        <li><a href="videos.html">Videos</a></li>
        <li><a href="services.html">Services</a></li>
        <li><a href="contact.html">Contact</a></li>
    </ul>
</div>
<div id="content">
    <div class="post">
        <h2 class="title">Order Now</h2>
        <div class="entry">
            <font size="-1">Note: This page is viewed correctly with Javascript enabled.</font>
            <div id="errors">
<p>One or more things went wrong:</p
    <ul></ul>
</div>
            <form id="orderForm" method="get" action="">
                    <label for="t_business"><input type="radio" name="business" value="business" id="t_business" />Business</label>
                <label for="t_individual"><input type="radio" name="indiv" value="indiv" id="t_individual" />Individual</label><br />
                <div id="business">
                    <label for="business_name">Business Name: </label><br /><input type="text" name="business_name" /><br />
                </div>

              <label for="f_name">First Name: *</label><br /><input type="text" id="f_name" /><br />
                <label for="l_name">Last Name: *</label><br /><input type="text" id="l_name"  /><br /><br />
                <label>Preferred Method of Contact: *</label>
                <label for="p_phone"><input type="radio" name="contact" id="p_phone" />Phone</label>
                <label for="p_email"><input type="radio" name="contact" id="p_email" />E-Mail</label><br />
                <div id="contact_phone">
                    <label for="phone_nr">Phone Number: </label><br /><input type="text" name="phone_nr" /><br />
                </div>
                <div id="contact_email">
                    <label for="email_add">E-mail Address: </label><br /><input type="text" name="email_add" /><br />
                </div>
                <br />
                <label>Project Type: </label><br />
                    <label for="v_school"><input type="radio" name="project" id="v_school" />School Project</label><br />
                    <label for="v_business"><input type="radio" name="project" id="v_business" />Business Video</label><br />
                    <label for="v_personal"><input type="radio" name="project" id="v_personal" />Personal Video</label><br />
                    <label for="v_collection"><input type="radio" name="project" id="v_collection" />Photo Collection</label><br />
                    <label for="v_other"><input type="radio" name="project" id="v_other" />Other...</label><br />
              <div id="v_other_info">
                    <label>Please Specify: </label><br />
                    <input type="text" name="v_other_info" />
              </div>
                <label>Additional Information: </label><br />
                <textarea rows="5" cols="30" name="add_info"></textarea><br />
                <input class="submit" type="submit" value="Submit" />
            </form>  
        </div>
    </div>
</div>

1 Ответ

2 голосов
/ 08 февраля 2012

Ваш селектор неверен.

$("#order_form").validate({ ... });

должно быть:

$("#orderForm").validate({ ... });

Фактически, если вы откроете отладчик (Firebug или аналогичный), вы увидите следующее сообщение:

ничего не выбрано, не может подтвердить, ничего не возвращать

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...