Question

这是我在这里发表的第一篇文章，我在这方面都非常业余，所以请耐心等待。我已经查看了：jQuery validate only if a specific radio button is selected以及回复这些帖子的人员链接的许多帖子。我觉得我有一切正确，但它只是没有用。

我有一个基本的联系表单，允许用户提供反馈，请求信息或请求服务。我希望只有在有服务订单/请求的情况下才需要“地址”字段。现在没有什么我可以弄清楚要求'地址'不能替换条件语句'必需：“ConReas_1：选中”'带'required：true'。该特定单选按钮的ID为“ConReas_1”

HTML：

...<td><label for="Address">Address: </label> 
    <input name="Address" type="text" id="Address" value="Street Address Including Apt. # if applicable." /></td>...

      ...<table width="600">
        <tr><td colspan="2"><label id="CRlabel">Reason for contact:</label></td></tr>
        <tr>
          <td width="189"><label>
            <input type="radio" name="ConReas" value="InfoReq" id="ConReas_0" onclick="OrderYN()"/>
            Request Info</label></td><td width="399"></td>
        </tr>
        <tr>
          <td><label>
            <input type="radio" name="ConReas" value="ServReq" id="ConReas_1" onclick="OrderYN()" />
            Order / Request Services</label></td><td></td>
        </tr>
        <tr>
          <td><label>
            <input type="radio" name="ConReas" value="WebFB" id="ConReas_2" onclick="OrderYN()" />
            Website Feedback</label></td><td></td>
        </tr>
        <tr>
          <td><label>
            <input type="radio" name="ConReas" value="GenFB" id="ConReas_3" onclick="OrderYN()" />
            General Feedback</label></td><td></td>
        </tr>
      </table>...

Javascript：

//Custom rules for form validation
jQuery.validator.addMethod("notEqual", function(value, element, param) {
return this.optional(element) || value != param;
}, "Please enter your correct info.");

//Form Validation
$(document).ready(function(){
$("#contact").validate({
    rules: {
        Fname: {
            required: true,
            minlength: 2,
            notEqual: "First Name"
        },
        Lname: {
            required: true,
            minlength: 2,
            notEqual: "Last Name"
        },
        Email: {
            required: true,
            email: true,
            notEqual: "name@example.com"
        },
        EmConf: {
            required: true,
            email: true,
            equalTo: "#Email",
            notEqual: "name@example.com"
        },
        ConReas: {
            required: true
        },
        Comment: {
            required: true,
            minlength: 20,
            notEqual: "Enter your comment, feedback, or question here."
        },
        Address:{
            required: "#ConReas_1:checked",
        },
        City:{
            required: true,
            notEqual: "City"
        },
        State:{
            required: true,
        },
        Zip:{
            required: true,
            notEqual: "XXXXX"
        }
    },debug:true,
    messages: {
        EmConf: {
            equalTo: "Both Email fields must match."
        },
        ConReas: {
            required: "You must select a contact reason."
        },
        Comment: {
            notEqual: "Please enter your comment, feedback or question below."
        },
        State: {
            required: "Please select your state."
        }
    },
    errorPlacement: function(error, element) { 
        if ( element.attr("name") == "ConReas" ) 
            error.insertAfter("#CRlabel");
        else if (element.attr("name") == "Comment" )
            error.insertAfter("#cmtlbl");
        else
            error.insertAfter(element);
    }
});
$("#ConReas_01").click(function() {
    $("#Address").valid();
});
$("#ConReas_1").click(function() {
    $("#Address").valid();
});
$("#ConReas_2").click(function() {
    $("#Address").valid();
});
$("#ConReas_3").click(function() {
    $("#Address").valid();
});
});

提前感谢您提供的任何帮助。这些论坛一直是教导我自己的网页设计的神。

只有在选择了特定的单选按钮时，jQuery才会生效

0 个答案: