GridView绑定bootstrap datepicker后文本框出现多余00:00:00时间后缀问题

问题原因 #

1. 日期绑定未指定格式：数据源中的amr_plan是DateTime类型，直接用Eval("amr_plan")绑定时，ASP.NET会默认调用DateTime的ToString()方法，自动带上时间部分，未赋值的时间就会显示为00:00:00
2. RowDataBound逻辑有误：之前的行绑定事件大概率没有针对编辑状态的行做处理，只处理了普通展示状态的行，编辑项里的文本框没有被格式化
3. 回发重复绑定：如果Page_Load中GridView的绑定逻辑没有套if(!IsPostBack)判断，每次触发行更新事件回发时都会重新绑定数据源，覆盖你选中的日期，重新生成带时间后缀的内容

解决方案 #

步骤1：修正绑定语法，指定日期格式化字符串 #

修改GridView模板代码，给Eval方法增加格式化参数，同时修正原有代码中Label标签缺失单引号的语法错误：

<asp:TemplateField HeaderText="AMR Plan">
    <ItemTemplate>
        <asp:Label Text='<%# Eval("amr_plan", "{0:MM/dd/yyyy}") %>' Width="130px" runat="server"></asp:Label>
    </ItemTemplate>
    <EditItemTemplate>
        <asp:TextBox ID="txtAMRPlan" Text='<%# Eval("amr_plan", "{0:MM/dd/yyyy}") %>'  Width="130px" runat="server"></asp:TextBox>
    </EditItemTemplate>                
</asp:TemplateField>

步骤2：修正RowDataBound事件逻辑（可选，兜底处理） #

如果绑定后仍有问题，在RowDataBound中专门处理编辑状态行的日期文本框：

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // 只处理数据行
    if (e.Row.RowType != DataControlRowType.DataRow) return;
    // 判断当前行是否为编辑状态
    if ((e.Row.RowState & DataControlRowState.Edit) > 0)
    {
        TextBox txtAMR = e.Row.FindControl("txtAMRPlan") as TextBox;
        if (txtAMR != null && DateTime.TryParse(txtAMR.Text, out DateTime date))
        {
            txtAMR.Text = date.ToString("MM/dd/yyyy");
        }
    }
}

步骤3：修正页面绑定逻辑 #

检查Page_Load代码，确保GridView的绑定逻辑只在首次加载时执行：

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        // 只有首次加载时绑定GridView
        GridView1.DataSource = 你的数据源;
        GridView1.DataBind();
    }
}

步骤4：前端兜底（可选） #

修改datepicker初始化代码，选完日期后强制格式化文本框值，避免前端层面出现多余时间后缀：

$(function () {
    $('[id*=txtAMRPlan]').datepicker({
        changeMonth: true,
        changeYear: true,
        format: "mm/dd/yyyy",
        language: "tr",
        autoclose: true
    }).on('changeDate', function(e){
        $(this).val(e.format('mm/dd/yyyy'));
    });
});

内容的提问来源于stack exchange，提问作者Jacknife