0

我对这种情况有疑问(http://jsfiddle.net/LFG8G/)。在我的移动页面中,有一个选择菜单元素,其中包含一组值(在我的示例中为 01,02,03)以及可折叠内容块内的一组其他控件。

表格如下所示:

<div data-role="page" id="pagina">
    <form action="http://www.google.com" method="get" id="form1">
        <div data-role="content">
            <select name="myOption" id="myOption" data-native-menu="false">
                <option value="">&nbsp;</option>
                <option value="01">Value 01</option>
                <option value="02">Value 02</option>
                <option value="03">Value 03</option>

            </select>
            <input type="submit" data-role="button" value="Validate" />
            <div data-role="collapsible">
                <h3>Other fields</h3>
                <div>
                    <div data-role="fieldcontain">
                        <label for="f1"><strong>Field 1</strong></label>
                        <input type="text" name="f1" id="f1" />
                    </div>
                    <div data-role="fieldcontain">
                        <label for="f2"><strong>Field 2</strong></label>
                        <input type="text" name="f2" id="f2" />
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

我必须在将数据提交到服务器之前验证字段,并且我使用了 jquery 验证插件。

选择特定选项菜单(项目 01)时,必须填写内容块中的字段。

我已经为此编写了规则,但是当按下按钮验证时,如果用户看不到内容,则不执行验证代码。

javascript看起来像这样:

    $(document).live('pageshow', function (event, ui) {
        $('#form1').validate({
            ignore:'',
            rules: {
                myOption: {
                    required: true
                },
                f1: {
                    required: {

                        depends: function (el) {
                            if ($('#myOption').val() == "01") {
                                return true;
                            } else {
                                return false;
                            }
                        }
                    }
                },
                f2: {
                    required: {

                        depends: function (el) {
                            if ($('#myOption').val() == "01") {
                                return true;
                            } else {
                                return false;
                            }
                        }
                    }
                }
            }
        });
    });
4

1 回答 1

1

默认情况下,验证插件不验证隐藏字段。您需要做的是在您的验证调用中添加一个选项来关闭它:

$('#form1').validate({
   ignore:'',
   //your other options
});

就是这样。看到它在这里工作:http: //jsfiddle.net/ryleyb/LFG8G/1/

于 2012-12-12T16:21:47.977 回答