Twitter bootstrap 启动日期选择器在表单提交时打开

我有一个奇怪的问题，当我点击表单的提交按钮时，bootstrap datepicker会打开。我正在使用MVC4。 下面是我的javascript

$(document).ready(function () {
           $('#startDate').datepicker({
               format: 'dd/mm/yyyy',
               autoclose: true,
               todayBtn: true
           });

           $('#endDate').datepicker({
               format: 'dd/mm/yyyy',
               autoclose: true,
               todayBtn: true
           });

           $('.chosen').chosen();

           $('#btnSubmit').click(function () {
               $('#form1').submit();
           });
       });

HTML是

<div class="form-group">
            <label class="col-md-4 control-label">Start Date</label>
            <div class="col-md-6">
                @Html.TextBoxFor(m => m.From, new
           {
               @class = "form-control",
               @id = "startDate",
               @Value = Model.From.ToString("dd/MM/yyyy")
           })
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-4 control-label">End Date</label>
            <div class="col-md-6">
                @Html.TextBoxFor(m => m.To, new
           {
               @class = "form-control",
               @id = "endDate",
               @Value = Model.To.ToString("dd/MM/yyyy")
           })
            </div>
        </div>

    <div class="form-group">
        <div class="col-md-4"></div>
        <div class="col-md-8">
            @Html.AntiForgeryToken()

            @Html.ActionLink("Cancel", "Index", "TradeActivityGroups", null, new { @class = "btn btn-danger" })
            <button type="button" class="btn btn-success" id="btnSubmit">Submit</button>
        </div>

开始日期
@Html.TextBoxFor（m=>m.From，新
{
@class=“表单控制”，
@id=“开始日期”，
@值=模型.From.ToString（“dd/MM/yyyy”）
})
结束日期
@Html.TextBoxFor（m=>m.To，新建）
{
@class=“表单控制”，
@id=“endDate”，
@Value=Model.To.ToString（“dd/MM/yyyy”）
})
@Html.AntiForgeryToken（）
@ActionLink（“取消”、“索引”、“TradeActivityGroups”，null，新{@class=“btn btn danger”}）
提交

谁能告诉我我做错了什么

更新：

此问题仅出现在Chrome浏览器上，而不出现在任何其他浏览器上。

请尝试在JS中重写

#btnSubmit

事件处理程序，如下所示：

$('#btnSubmit').click(function (event) {
    event.preventDefault();
    event.stopImmediatePropagation();
    $('#form1').submit();
});

---

该方法将防止任何事件在DOM中传播，这可能会导致您的问题。阻止触发该元素的默认处理程序。

删除datepicker的format属性它可能与执行提交的验证冲突，因此我假设您必须返回视图。是否有任何在页面加载时运行的脚本可能会触发日期选择器打开？我不知道Bootstrap datepicker，但可能是因为您使用

@value=Model.From.ToString（“dd/MM/yyyy”）

设置值，这与您在初始页面加载中选择日期时发布的内容不同。不，页面加载中没有触发datepicker打开的脚本。页面上只存在我在问题中提到的脚本。当您第一次加载页面（从GET方法）时，日期选择器是否打开？尝试正确呈现文本框

@Html.TextBoxFor（m=>m.From，“{0:dd/MM/yyyy}”，new{@class=“datepicker form control”}）

，然后脚本可以是

$（'.datepicker'）.datepicker（{format:'dd/MM/yyyy'，autoclose:true，todayBtn:true}）。我注意到，当我删除日期格式时，此问题已得到修复