0

我正在开发一个表单，该表单使用“jquery 验证插件”验证客户端，使用 php 验证服务器端。这是我的标记

HTML

<div id="recipe-form">
                <div class="row">
                <div class="col col-lg-9">
                <form id="recipe-submit-form" class="form-horizontal" name="newad" method="post" enctype="multipart/form-data"  action="<?php the_permalink(); ?>">   


                <div class="row control-group onoffclass">
                <label for="recipetitle" class="col col-lg-2 control-label">Recipe Title:<sup>&#42;</sup></label>
                <div class="col col-lg-7 controls">
                <input id="recipetitle" class="input-with-feedback" name="recipetitle" data-content="Required: Minimum 10 characters long" data-placement="top" data-toggle="popover" title="Recipe Title" placeholder="Recipe Title" type="text" />
                <?php if($titleError != '') { ?><span class="nojserror"><?php echo $titleError;?></span><?php } ?>
                </div>
                </div> <!-- recipe title -->


                <div class="row control-group onoffclass">
                <label for="recipedesc" class="col col-lg-2 control-label">Recipe Desc:<sup>&#42;</sup></label>
                <div class="col col-lg-7 controls">
                <textarea id="recipedesc" class="input-with-feedback" name="recipedesc" data-content="Required: A Brief recipe description" data-placement="top" data-toggle="popover" title="Recipe Description" placeholder="Recipe Short Description"></textarea>
                <?php if($descError != '') { ?><span class="nojserror"><?php echo $descError;?></span><?php } ?>

                </div>
                </div> <!-- recipe desc -->
                <div class="row">
                <div id="submitform" class="col col-lg-10 col-offset-2">
                <button name="Submit" type="submit" id="formsubmit" class="btn btn-default">Submit Recipe</button>
                </div>
                </div>
                <input type="hidden" name="submitted" id="submitted" value="true" />

                </form>
                </div>
                </div>
                </div>

PHP

<?php
                if(isset($_POST['submitted'])) {
                //title
                if(trim($_POST['recipetitle']) === '')  {
                $titleError = 'Please enter title for your recipe.';
                $hasError = true;
                } else if (strlen(trim($_POST['recipetitle']))<= 10) {
                $titleError = 'Recipe Title is too short.';
                $hasError = true;
                } else {
                $recipetitle = trim($_POST['recipetitle']);
                }

                //desc
                if(trim($_POST['recipedesc']) === '')  {
                $descError = 'Please enter description for your recipe.';
                $hasError = true;
                } else if (strlen(trim($_POST['recipedesc']))<= 10) {
                $descError = 'Recipe description is too short.';
                $hasError = true;
                } else {
                $recipedesc = trim($_POST['recipedesc']);
                }

                }
                ?>

jQuery

             <script>
            $(document).ready(function(){
            var ruleSet1 = {
            required: true,
            minlength: 10
            };
            $('#recipe-submit-form').validate({
            rules: {
            recipetitle: ruleSet1,
            recipedesc: ruleSet1,
            }

            });
            });
            </script>

一切似乎都很好，我面临的问题是，当我禁用 Javascript 时，php 会显示验证错误。同时我启用 Javascript 并重新提交表单。现在 jquery 还将在 php 错误旁边显示验证错误。请查看屏幕截图以了解问题。 在此处输入图像描述

将不胜感激任何帮助

问候

4

1 回答 1

0

如果根据 ifjs或php error.来应用特定的错误类呢？

<span class="jsError">Some Error</span>
<span class="phpError">Some Error</span>

在你的css你只会隐藏js错误。

.jsError {
    display:none;
}

在您的js, 隐藏php errors并在那里进行正常的 jQuery 验证，这将只显示js errors.

$(function() {
    $('.phpError').hide();

    //after doing your jsValidation show js error only
});

这样如果js被禁用，只会PHP出现错误。

于 2013-07-25T21:36:21.070 回答