0

我一直在尝试使用这里找到的 XD Soft jQuery 插件：

datetimepicker 我使用 NuGet 将它安装到我的 asp.net mvc 项目中。我想在我的表单中使用内联日期和时间选择器 这是 HTML

<head>
<title>Create</title>  

<link rel="stylesheet" href="~/Content/jquery.datetimepicker.css"/>

</head>

<h2>Create</h2>


@using(Html.BeginForm()) 
{
@Html.AntiForgeryToken()

<div class="form-horizontal">
    <h4>Event</h4>

<hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })

<div class="form-group">
        @Html.LabelFor(model =>model.Name, htmlAttributes: new { @class =   "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
        </div>
    </div>


    <div class="form-group">
        @Html.LabelFor(model => model.Date, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Date, new { @id = "datetimepicker3", @style ="width:150px" })
            @Html.ValidationMessageFor(model => model.Date, "", new { @class = "text-danger" })
        </div>
    </div>


    <div class="form-group">
        @Html.LabelFor(model => model.Description, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">

            @Html.EditorFor(model => model.Description, new { htmlAttributes   = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Description, "", new {     @class = "text-danger" })
        </div>
    </div>

 <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Create" class="btn btn-default" />

        </div>
    </div>
</div>
}

<div>
@Html.ActionLink("Back to List", "Index")   
</div>

@section Scripts {

<script type="text/javascript" src="/scripts/jquery.min.js"></script>
<script type="text/javascript" src="/scripts/bootstrap.min.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.datetimepicker.js">       </script>
<script type="text/javascript">
jQuery('#datetimepicker3').datetimepicker({
    format: 'd.m.Y H:i',
    inline: true,
    lang: 'ru'
});
</script>

@Scripts.Render("~/bundles/jqueryval")

 }

然而，目前只显示一个普通日历，允许用户选择日期、月份和年份，但不能选择我需要的时间。我尝试了一些不同的插件和教程，但我无法获得一个按预期工作的。任何帮助都会很棒，因为我已经坚持了很长时间并且没有得到任何帮助，谢谢。

4

1 回答 1

0

我找出了我需要在表单中使用 TextBoxFor 而不是 EditorFor 的问题。这是实施了更改的视图。

<head>
<title>Create</title>

<link rel="stylesheet" href="~/Content/jquery.datetimepicker.css" />

</head>

<h2>Create Event</h2>


@using (Html.BeginForm())
{
@Html.AntiForgeryToken()

<div class="form-horizontal">

    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Location, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Location, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Location, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
            @Html.LabelFor(model => model.Date, htmlAttributes: new { @class  = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.TextBoxFor(model => model.Date, new { id =   "datetimepicker3", @style = "width:150px" })
            @Html.ValidationMessageFor(model => model.Date, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Description, htmlAttributes: new {   @class = "control-label col-md-2" })
        <div class="col-md-10">

            @Html.EditorFor(model => model.Description, new { htmlAttributes   = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Description, "", new {   @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Create" class="btn btn-default" />

        </div>
    </div>
</div>
}

<div>
@Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {

<script type="text/javascript" src="~/Scripts/jquery.min.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap.min.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.datetimepicker.js"></script>
<script type="text/javascript">
    jQuery('#datetimepicker3').datetimepicker({
        format: 'd.m.Y H:i',
        inline: true,
        lang: 'en'
    });
</script>

@Scripts.Render("~/bundles/jqueryval")

}
于 2015-12-07T20:19:44.960 回答