多个日期选择器控制验证(超过2个)

时间:2017-01-24 06:46:33

标签: javascript jquery asp.net-mvc validation datepicker

我有7个日期选择器,我需要对所有人进行验证 请检查图像。 前端:http://imgur.com/a/Izj2Z

此处调查日期<包装日期<出口清关日期<发货日期<进口清关日期<交货日期

我有一些示例,其中视图中只有两个日期选择器,但它们在此上下文中没有帮助。有人可以帮助解决代码中的这个问题吗?我需要在上一行中选择的日期之前的所有日期保持禁用日历。此外,我希望日历跳过几个月并仅显示启用日期的月份(即假设我的调查日期是1月31日,那么包装日期日历应该是2月份而不是1月份)

代码:

@model IList<Writer.Repository.Models.MovePlanAT>
@{
    ViewBag.Title = I18N("Move Plan");
}

<div id="wrap-MovePlanAT">
    <div class="ibox" id="pnlMovePlanAT">
        <div class="ibox-title no-padding no-borders">
            <h5>@I18N("Move Plan")</h5>
            <div class="ibox-tools">
                <button type="button" class="close-link close marl-5" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            </div>
        </div>

        @using (Html.BeginForm("MovePlanUpdate/" + ViewData["MoveID"], "Move", FormMethod.Post, new { @class = "form-horizontal", @id = "frmMovePlanAT" }))
        {
            @Html.AntiForgeryToken()

            <div class="ibox-content clearfix" id="pnlMovePlanAT">
                <div class="row">
                    @{ int i = 0; }
                    @for (i = 0; i < Model.Count(); i++)
                    {
                        <div class="form-group">
                            <label class="col-sm-5">@I18N(Model[i].ActivityName)</label>

                            <div class="col-sm-7">
                                <div class="input-group input-group-sm datemp">
                                    @Html.EditorFor(m => m[i].TaskUpDatedOn, new { htmlAttributes = new { @class = "form-control input-sm", @placeholder = @I18N(Model[i].ActivityName), @data_format = ShortDateFormatJs } })
                                    <span class="input-group-addon">
                                        <span class="glyphicon glyphicon-calendar"></span>
                                    </span>
                                </div>
                                @Html.ValidationMessageFor(m => m[i].TaskUpDatedOn, "", new Dictionary<string, object> { { "class", "text-danger" }, { "data-valmsg-for", "[" + i + "].TaskUpDatedOn" } })

                                @Html.HiddenFor(m => m[i].MoveID)
                                @Html.HiddenFor(m => m[i].ShipmentModeID)
                                @Html.HiddenFor(m => m[i].ActivityScoreboardID)
                                @Html.HiddenFor(m => m[i].ShipmentModeID)
                                @Html.HiddenFor(m => m[i].ActivityName)
                                @Html.HiddenFor(m => m[i].CummulativeHrs)
                                @Html.HiddenFor(m => m[i].TaskDateOn)
                            </div>
                        </div>
                        <hr class="m-t-sm m-b-sm" />
                }
                </div>
                <div class="row">
                    <div class="form-group no-margins">
                        <div class="text-center">
                            <input id="btnMovePlanSave" type="submit" value="@I18N("Save")" class="btn btn-primary btn-sm" />
                        </div>
                    </div>
                </div>
            </div>
        }
    </div>

    <script>
        $(document).ready(function () {
            $('#pnlMovePlanAT .datemp').datetimepicker({
                format: "@ShortDateFormatDatePickerJs"
            }).on('dp.change', function (e) {
                @*console.log(e.date.format("@ShortDateFormatDatePickerJs"))
                console.log($(e.target).find('input[type="date"]'))*@
                // logic to check with next datepicker in the list
            }).datetimepicker('dp.update');

            $('#btnMovePlanSave').on('click', function (e) {
                e.preventDefault();

                $('#pnl-moveplan').mask("@I18N("Loading...")");
                $('form#frmMovePlanAT').ajaxSubmit({
                    success: function (data) {
                        $('#wrap-MovePlanAT').html(data.Result);
                        if (data.Success) {
                            toastr.success("@I18N("Move plan saved successfully.")");
                            $('[data-target="' + $('.webui-popover.in').attr('id') + '"]').webuiPopover('hide');
                            fnReloadMoveStats();
                        }
                        $('#pnl-moveplan').unmask();
                    },
                    complete: function () {
                        $('#pnl-moveplan').unmask();
                    }
                });
            });
        });

    </script>
</div>

任何帮助都会非常值得注意!

0 个答案:

没有答案