编辑时文件上载字段的jQuery验证

Question

我正在尝试使用jQuery验证插件验证表单中的文件上载字段。我只需要检查文件是否已上载，而不需要检查文件是否具有特定的大小和/或类型。在最初提交时一切正常，问题是表单被提交到数据库，并允许以后编辑。编辑表单时，我设置了一个附加的隐藏字段，末尾附加了\u orig。因此，对于名为check\u upload的字段，有一个名为check\u upload\u orig的字段，其中将包含以前的提交数据。这样用户就不必每次都重新上传文件。因此，当check\u upload字段为空时，我不知道如何编写一个方法来检查“check\u upload\u orig”字段是否有值。此特定表单中有多个文件上载字段。有些是必需的，有些不是。有什么建议吗？

以下是新表单上的代码：

<script type="text/javascript">
    $(document).ready(function(){
        $("#modify").validate({
            onkeyup: function(element){ $(element).valid(); },
            onfocusout: function(element){ $(element).valid(); },
            rules: {
            },
            highlight: function(element, errorClass, validclass) {
                // if the element is a checkbox, highlight the entire group
                if(element.type=='checkbox') {
                    $(element).parent('.ctrlHolder').addClass('error');
                } else {
                    $(element).addClass('error');
                }
            },
            unhighlight: function(element, errorClass, validclass) {
                if(element.type=='checkbox') {
                    $(element).parent('.ctrlHolder').removeClass('error');
                } else {
                    $(element).removeClass('error');
                }
            },
            submitHandler: function(form) {
                form.submit();
            }
        });
    }); // end $(document).ready(function()
</script>

<form enctype="multipart/form-data" id="modify" name="modify" action="./" method="post">
    <input type="file" id="check_upload" name="check_upload" class=""  />
    <input type="hidden" id="check_upload_orig" name="check_upload_orig" value=""  />
    <input type="submit" />
</form>

下面是编辑表单的代码。唯一的区别是检查上传\u原始字段包含上一次提交的值。因此，如果设置了该值，则不应要求该字段上载新文件。

<script type="text/javascript">
    $(document).ready(function(){
        $("#modify").validate({
            onkeyup: function(element){ $(element).valid(); },
            onfocusout: function(element){ $(element).valid(); },
            rules: {
            },
            highlight: function(element, errorClass, validclass) {
                // if the element is a checkbox, highlight the entire group
                if(element.type=='checkbox') {
                    $(element).parent('.ctrlHolder').addClass('error');
                } else {
                    $(element).addClass('error');
                }
            },
            unhighlight: function(element, errorClass, validclass) {
                if(element.type=='checkbox') {
                    $(element).parent('.ctrlHolder').removeClass('error');
                } else {
                    $(element).removeClass('error');
                }
            },
            submitHandler: function(form) {
                form.submit();
            }
        });
    }); // end $(document).ready(function()
</script>

<form enctype="multipart/form-data" id="modify" name="modify" action="./" method="post">
    <input type="file" id="check_upload" name="check_upload" class=""  />
    <input type="hidden" id="check_upload_orig" name="check_upload_orig" value="32.jpg"  />
    <input type="submit" name="view_fa_php_submit" id="view_fa_php_submit" class="submit view_fa_php_submit" value="Continue" />
</form>

Answer 1

您的规则可能看起来像：

rules: {
    check_upload: {
        required: '#check_upload_orig:blank'
    }
}

这意味着如果check\u upload\u orig为空，则只需执行check\u upload。：blank-pseudoselector是jQuery验证的自定义选择器（请参阅：http://jqueryvalidation.org/blank-selector/).

有关所需功能的更多信息，请参阅http://jqueryvalidation.org/required-method/

我希望这对你有点帮助

代码没有经过测试

Answer 2

以下是我最后使用的代码：

<script type="text/javascript">
    $(document).ready(function(){
        $("#modify").validate({
            onkeyup: function(element){ $(element).valid(); },
            onfocusout: function(element){ $(element).valid(); },
            rules: {
                check_upload: {
                    required: {
                        depends: function(element) {
                            return $("#check_upload_orig").is(":blank");
                        }
                    },
                },
            },
            highlight: function(element, errorClass, validclass) {
                // if the element is a checkbox, highlight the entire group
                if(element.type=='checkbox') {
                    $(element).parent('.ctrlHolder').addClass('error');
                } else {
                    $(element).addClass('error');
                }
            },
            unhighlight: function(element, errorClass, validclass) {
                if(element.type=='checkbox') {
                    $(element).parent('.ctrlHolder').removeClass('error');
                } else {
                    $(element).removeClass('error');
                }
            },
            submitHandler: function(form) {
                form.submit();
            }
        });
    }); // end $(document).ready(function()
</script>

<form enctype="multipart/form-data" id="modify" name="modify" action="./" method="post">
    <input type="file" id="check_upload" name="check_upload" class=""  />
    <input type="hidden" id="check_upload_orig" name="check_upload_orig" value="32.jpg"  />
    <input type="submit" name="view_fa_php_submit" id="view_fa_php_submit" class="submit view_fa_php_submit" value="Continue" />
</form>