jQuery required（dependency-expression）无法正常工作

Question

I am using jquery validation plugin. When I was using required( dependency-expression ) i noticed that required( dependency-expression ) are not working properly. as mentioned that i tried for

$("#flight_availability").validate({
    rules: { 
       Trip: { required: true },
       DepartDate: { required : "#OneTrip:checked" },
       Origin: { required:"#OriginId:blank" }
    },
});

In the above mentioned code the code DepartDate: { required : "#OneTrip:checked" }, works fine but Origin: { required:"#OriginId:blank" } does not work.

Whats wrong with the code? I used firebug. It did not show any errors. even used validation debug option too, but :(

Answer 1

As per OP's comments:

"even if OriginId is empty(blank), it validates it as true"

Yes, that is exactly how you programmed it.

Origin: {
    required: "#OriginId:blank"
}

The above code is saying that the Origin field is only required when the #OriginId field is left blank. Using #OriginId:filled , this logic is saying that the Origin field must remain empty if the #OriginId is filled in. If that's not exactly correct, then you can use the :blank selector instead.

http://jsfiddle.net/xMAs5/

If you want the opposite behavior then use the :filled selector instead.

Origin: {
    required: "#OriginId:filled"
}

http://jsfiddle.net/xMAs5/1/

---

Otherwise, here is a demo using a custom method called empty that works as per your comment: "So if OriginId is empty means Origin value (anything) is invalid."

$(document).ready(function () {

    $.validator.addMethod('empty', function (value, element) {
        return (value === '');
    }, "This field must remain empty!");

    $("#flight_availability").validate({
        rules: {
            Trip: {
                required: true
            },
            DepartDate: {
                required: "#OneTrip:checked"
            },
            Origin: {
                empty: {
                    depends: function (element) {
                        return $("#OriginId").is(":blank")
                    }
                }
            }
        }
    });

});

DEMO: http://jsfiddle.net/Ab8bT/

Answer 2

它可能是jQuery puesdo选择器尝试使用：empty而不是：blank。