1

我正在尝试使用以下链接将 jquery 日期时间选择器放在文本框中

当我单击日期文本框时，我无法在视图中看到日期时间选择器，为此我已经这样做了.. 这是我的观点

@Scripts.Render("~/bundles/jquery")
<script src="~/Scripts/jquery-ui-1.8.20.js"></script>
<script src="~/Scripts/jquery-ui-1.8.20.min.js"></script>
<script src="~/Scripts/RangeDateValidator.js"></script>
<script src="~/Scripts/jquerydatetimepicker.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
         $('.date').datepicker({ dateFormat: "dd/mm/yy" });
       // $('.date').datetimepicker();
    });
</script>
@model MvcSampleApplication.Models.DateEditModel
@{
    ViewBag.Title = "EditDateTimePick";
    //Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>EditDateTimePick</h2>
@using (Html.BeginForm())
{ 
    @Html.EditorFor(s=>s.DtpJqry)
    <input id="submit" name="submit" type="submit" value="Save" />
}

这是我的控制器部分

public class DateTimePickersController : Controller
{       
    public ActionResult Index()
    {
        return View("EditDateTimePick");
    }
    [HttpGet]
    public ActionResult Edit()
    {
        DateEditModel model = new DateEditModel();
        {
            var datetimechange = new DatePickerJquery { Name = "Raj", date = new DateTime(2010, 12, 15) };           
        };
        return View(model);
    }
    public ActionResult Edit(DatePickerJquery dtpjquery)
    {
        string message = null;
        if (ModelState.IsValid)
        {
            message = "Saved" + DateTime.Now;            
        }
        DateEditModel models = new DateEditModel { 
              DtpJqry = dtpjquery,
              Message = message                        
        };
        return View(models);
    }
}

这是另一种观点

@model DateTime
@Html.TextBox("", Model.ToString("dd/MM/yyyy"), new { @class = "date" })

修改后的视图：

@Scripts.Render("~/bundles/jquery")
<script src="~/Scripts/jquery-ui-1.8.20.js"></script>
<script src="~/Scripts/RangeDateValidator.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
         $('.date').datepicker({ dateFormat: "dd/mm/yy" });
       // $('.date').datetimepicker();
    });
</script>
@model MvcSampleApplication.Models.DateEditModel
@{
    ViewBag.Title = "EditDateTimePick";
    //Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>EditDateTimePick</h2>
@using (Html.BeginForm())
{ 
    @Html.EditorFor(s=>s.DtpJqry)
    <input id="submit" name="submit" type="submit" value="Save" />
}

任何人请提出任何关于它如何不显示日期时间选择器的想法，这将非常感谢我提前多谢....

4

2 回答 2

1

你快到了。您有日期时间选择器查看所有标签，date您只需将该类添加到您的字段中即可。

<h2>EditDateTimePick</h2>
@using (Html.BeginForm())
{ 
    @Html.EditorFor(s=>s.DtpJqry, new { Class="date" })
    <input id="submit" name="submit" type="submit" value="Save" />
}

更新

从你的脚本引用中取出最小值，这样你就只引用了一次 jQuery UI：

<script src="~/Scripts/jquery-ui-1.8.20.js"></script>
<script src="~/Scripts/RangeDateValidator.js"></script>
<script src="~/Scripts/jquerydatetimepicker.js"></script>

更新 2

模板局部视图需要存在于特定的文件夹名称中，并且局部视图文件的名称应该是类型的名称。

EditorTemplates- 对于编辑或

DisplayTemplates- 用于展示

- Shared
    -EditorTemplates
        DateTime.cshtml

这将允许以下语法起作用：

@Html.EditorFor(m => m.MyDateTimeProperty)
于 2013-07-27T04:24:24.420 回答
0

$('#txtDtpJqry').datepicker({ dateFormat: "dd/mm/yy" });

通过声明该文本框的 id 或类来代替 EditorFor 尝试 TextboxFor。
@Html.TextBoxFor(s=>s.DtpJqry, new { id = "txtDtpJqry" })

它工作正常。

于 2013-07-27T05:16:56.897 回答