Question

我有像这样的HTML

<form class="form-filter" id="form-filter-excel" role="form">
            <div class="row">
                <div class="col-md-4 col-sm-5">
                    <label>Date range</label>
                    <div class="input-group input-daterange datepicker">
                        <input id="fRange" name="fRange" class="form-control input-sm" type="text">
                        <span class="input-group-addon bg-primary">to</span>
                        <input id="sRange" name="sRange" class="form-control input-sm" type="text">
                    </div>
                </div>
                <div class="col-md-2 col-sm-1">
                    <label>
                        &nbsp;
                    </label>
                    <a class="btn btn-wide btn-primary form-control" href="#" id="btnexport" ><i class="fa fa-file-excel-o"></i> Export To Excel</a>
                </div>
            </div>
        </form>

结束我的屏幕拍摄

我的问题我想在jquery上使用validate（），但我有点卡住我想用class= "input-daterange"作为字段，并根据需要输入fRange和sRange。我如何做到这一点，如果我使用fRange和sRange作为字段，错误按摩显示混乱。有什么想法??

更新：很抱歉不清楚我的问题我正在使用像这些

的jquery验证

$('#form-filter-excel').validate({
            highlight: function(element) {
                $(element).closest('.form-group').prop('required',true);
            },
            unhighlight: function(element) {
                $(element).closest('.form-group').prop('required',false);
            },
            errorElement: 'span',
            errorClass: 'help-block',
            errorPlacement: function(error, element) {
                if(element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    error.insertAfter(element);
                }
            },
            rules: {
                fRange: {
                    required: true,
                    date: true
                },
                sRange: {
                    required: true,
                    date: true
                }
            },
             messages: {
                fRange: "Please insert these input",
                sRange: "Please insert these input"
            },
        });

        $('#btnexport').click(function() {
            $('#form-filter-excel').valid();

            if($('#form-filter-excel').valid()==true)
            {
                var Fod = $('#fRange').val();
                var Tod = $('#sRange').val();

                window.open(host+"ajax/excelpoinfo?Fod=" + Fod +"&Tod=" + Fod, '_blank'); 
            } 
        });

但问题是我的输入下没有显示错误按摩，但在我的屏幕上显示错误

我需要的是每个输入下的错误按摩节目。

更新：我改变主意，然后使用甜蜜警报，tq帮助。而对于Mayank Pandeyz来说，你没有清楚地看到我的问题，就像我说的那样，没有帮助，即使你说改变替换。还是不行。

Answer 1

在文本框上都提供name属性及其值，如：

<form id="frmDetails" name="frmDetails">
  <input type="textbox" name="fRange">
  <input type="textbox" name="sRange">
</form>

并将验证码放在以下内容上：

$('#frmDetails').validate({
    rules:
    {
        fRange: {
            required: true
        },
        sRange: {
            required: true
        }
    },
    messages:
    {
        fRange: {
            required: "Please select fRange"
        },
        sRange: {
            required: "Please select sRange"
        }
    }
});

Working Fiddle

在jquery上验证validate（）

1 个答案: