0

我已经在另一个视图上使用了这个日期选择器，一个接收模型的 Create() 视图，然后我可以使用以下方法显示日期选择器：

<link rel="stylesheet"href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">

...  
@Html.EditorFor(model => model.OrderDate, new { htmlAttributes = new { @class = "form-control", placeholder = "OrderDate", @readonly = "true" } })

...

@section Scripts
{
@Scripts.Render("~/bundles/jqueryui")
<script type="text/javascript">
    jQuery.validator.methods["date"] = function (value, element) { return true; }
    $(document).ready(function () {
        $("#OrderDate").val("");
        $('input[type=datetime]').datepicker({
            dateFormat: 'dd/mm/yy',
            changeMonth: true,
            changeYear: true,
            yearRange: "-1:+2",
            onClose: function (dateText, inst) {
                $("#cmdEnter").focus();
            }
        });
    });
</script>
}

现在的问题是我需要在视图中使用日期选择器作为顶部的搜索字段之一，我正在尝试按范围实现日期搜索。这个视图是一个索引，这意味着它不接收模型它接收模型集合（在本例中为 PageList）：

@model PagedList.IPagedList<EntregaMedicamentos.Models.PedidoDisprofarmaViewModel>

所以，在这种情况下，我不能使用 model => model.OrderDate，然后我尝试使用 Viewbag 在那里传递那个日期，比如..

@Html.TextBox("searchDateFrom", ViewBag.currentFilter2 as DateTime?, new { @class = "form-control", placeholder = "Desde fecha", @readonly = "true" })

所以我从 EditorFor 更改为 TextBox 并尝试使用 Editor 但日期选择器仍然不想在点击时弹出，有什么想法吗？

这是一个尝试过的，仍然没有弹出窗口：

@Html.TextBox("searchDateFrom", ViewBag.currentFilter2 as DateTime?, new { @class = "form-control", placeholder = "Desde fecha", @readonly = "true" })

....

@section scripts
{
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jqueryui")
@Styles.Render("~/Content/cssjqryUi")

<script type="text/javascript">
    jQuery.validator.methods["date"] = function (value, element) { return true; }
    $(document).ready(function () {
        $("#searchDateFrom").val("");
        $('input[type=datetime]').datepicker({
            dateFormat: 'dd/mm/yy',
            changeMonth: true,
            changeYear: true,
            yearRange: "-1:+2",
            onClose: function (dateText, inst) {
                $("#cmdSearch").focus();
            }
        });
    });
</script>
...

谢谢！！

4

2 回答 2

1

您可以使用

<input type="datetime" name="ordredate">

因为@Html.TextBox() 没有生成文本框类型“日期时间”。

于 2018-12-25T10:22:55.923 回答
1

您可以像这样在助手中附加type="datetime"属性：TextBox

@Html.TextBox("searchDateFrom", ViewBag.currentFilter2 as DateTime?, new { @class = "form-control", placeholder = "Desde fecha", 
              @readonly = "readonly", type = "datetime" })

然后DisplayFormatAttribute在 datepicker 中添加与提供的格式匹配的内容：

[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
public DateTime searchDateFrom { get; set; }

请注意，@Html.TextBox()助手默认生成<input type="text" />元素，您需要指定type="datetime"启用日期时间日历选择器，如 jQuery 代码中提供的那样。

你可以在这个 fiddle中看到一个 datepicker 实现的例子。

于 2018-12-26T02:07:07.197 回答