Javascript Can'；如果使用jquery timepicker，则不能从模式弹出窗口发布表单

我正在使用创建活动日历。下面我将在ASP.NETMVC5中创建应用程序

当我单击日历时，例如30/04/2015 02:00 PM-30/04/2015 03:00 PM，将显示弹出窗体。在弹出式窗体中，我在开始和结束字段上使用and。以下是描述我所做工作的图片和代码：

Index.cshtml：

@Html.DayPilotCalendar("dp", new DayPilotCalendarConfig
{
    BackendUrl = Url.Action("Backend", "Calendar"),
    BusinessBeginsHour = 8,
    BusinessEndsHour = 19,
    ViewType = ViewType.Day,
    TimeRangeSelectedHandling = TimeRangeSelectedHandlingType.JavaScript,
    TimeRangeSelectedJavaScript = "create(start, end)",
    EventClickHandling = EventClickHandlingType.JavaScript,
    EventClickJavaScript = "edit(e)",
    EventMoveHandling = EventMoveHandlingType.Notify,
    EventResizeHandling = EventResizeHandlingType.Notify,
    EventDeleteHandling = EventDeleteHandlingType.CallBack
})

<script type="text/javascript">
    function create(start, end) {
        var m = new DayPilot.Modal();
        m.closed = function () {
            if (this.result == "OK") {
                dp.commandCallBack('refresh');
            }
            dp.clearSelection();
        };
        m.showUrl('@Url.Action("Create", "Event")?start=' + start + '&end=' + end);
    }
</script>

如果我单击“保存”按钮，它总是将焦点转到“开始时间”文本框。我已经使用F12开发工具进行了调试，没有错误或后期操作。如果我不使用jquery timepicker，问题就解决了

---

我做错了什么？

我想是你班上的

数据格式字符串

，修改如下：

public class CreateEventViewModel
{
    [Required]
    [StringLength(50)]
    public string name { get; set; }

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

    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:t}")]
    public DateTime starttime { get; set; }

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

    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:t}")]
    public DateTime endtime { get; set; }
}

---

我刚刚在

starttime

和

endtime

上将

{0:HH:mm}

小时格式更改为

{0:t}

，我猜提交事件处理程序中有一个错误：

$("form").submit(function () {
    var f = $("form");
    if (f.valid()) {
        $.post(f.action, f.serialize(), function (result) {
            close(eval(result));
        });
    }
    return false;
});

该错误防止调用“return false；”，这意味着直接过帐表单，而不是使用$.post（）调用。浏览器JS控制台通常在POST上被清除，这就是为什么您没有看到任何错误

实际的问题可能是f.serialize（）没有正确地序列化jQuery日期/时间选择器中的值

尝试使用Try{…}catch（e）{…}包装代码以查看错误：

 $("form").submit(function () {
     try {
         var f = $("form");
         if (f.valid()) {
             $.post(f.action, f.serialize(), function (result) {
                 close(eval(result));
             });
         }
         return false;
     }
     catch(e) {
         alert("Error while processing the form: " + e);
     }
});

---

DataFormatString

与此无关。并且可以删除

ApplyFormatInEditMode

。当呈现浏览器HTML5 datepicker或timepicker时，

@Html.EditorFor（）

方法只考虑这些属性（唯一的目的是添加

type=“date”

或

type=“time”

属性，如果使用插件则不需要这些属性），感谢您的回答，正如@StephenMuecke所解释的，时间字段的属性应为

type=“time”

$("form").submit(function () {
    var f = $("form");
    if (f.valid()) {
        $.post(f.action, f.serialize(), function (result) {
            close(eval(result));
        });
    }
    return false;
});

 $("form").submit(function () {
     try {
         var f = $("form");
         if (f.valid()) {
             $.post(f.action, f.serialize(), function (result) {
                 close(eval(result));
             });
         }
         return false;
     }
     catch(e) {
         alert("Error while processing the form: " + e);
     }
});