Question

我使用带角度表单的ui.bootstrap.datepickerPopup，但我也想将它与ASP.Net html表单一起使用。如果我使用MVC EditorTemplate如下

//Date.cshtml
@{ 
        var prop = ViewData.ModelMetadata.PropertyName;
        var required = ViewData.ModelMetadata.IsRequired;
<p class="input-group"  >
    <input type="text" uib-datepicker-popup="dd/MM/yyyy" id="@prop" name="@prop" ng-model="@prop" @required class="form-control" ng-required="true" is-open="@(prop)Open"  init-date="new Date()"  value="@ViewData.Model"/>
    <span class="input-group-btn">
        <button type="button" class="btn btn-default" ng-click="@(prop)Open = !@(prop)Open"><i class="glyphicon glyphicon-calendar"></i></button>
    </span>
</p>
    }

我可以选择日期并正确发布。但是，当我尝试编辑具有现有日期值的表单时，我无法让它预先填充日期。初始日期可以内联传递吗？我试图在这里的一个plunkr测试这个。 http://plnkr.co/edit/glVfsqNVst11IxRvF3tJ?p=preview

Answer 1

您必须将其设置为datepicker-options，如下所示。

<input type="text" uib-datepicker-popup="dd/MM/yyyy" id="@prop" name="@prop" ng-
model="@prop" @required class="form-control" ng-required="true" is-
open="@(prop)Open"  datepicker-options="{minDate:'@ViewData.DateOptions'}"  value="@ViewData.Model"/>

Answer 2

试试这个... bootstrap 3 datepicker version 4.你也可以设置默认值

https://eonasdan.github.io/bootstrap-datetimepicker/

来自网站的

代码段......

<div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker5'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker5').datetimepicker({
                    defaultDate: "11/1/2013",
                    disabledDates: [
                        moment("12/25/2013"),
                        new Date(2013, 11 - 1, 21),
                        "11/22/2013 00:53"
                    ]
                });
            });
        </script>
    </div>
</div>

datepicker init有一个bug ...看到这个论坛.. https://github.com/angular-ui/bootstrap/issues/2331

如何使用带有html格式的ui.bootstrap.datepickerPopup

2 个答案: