如何在GridView中像操作TextBox那样获取Bootstrap DateTimePicker控件？

我完全懂你现在的困扰——因为Bootstrap DateTimePicker是基于原生HTML <input> 控件而非ASP.NET自带的<asp:TextBox>，所以后台没法直接像操作服务器控件那样顺手地做类型转换。下面我一步步帮你搞定这个问题：

第一步：先把DateTimePicker的标记代码补全规范 #

先把你的模板字段代码补全，确保控件能被后台正确识别，同时避免重复ID的问题：

<asp:TemplateField HeaderText="Start Date">
    <ItemTemplate>
        <div class='input-group date' id='datetimepicker_<%# Container.DataItemIndex %>'>
            <input type="text" 
                   class="form-control" 
                   id="txtStartDate" 
                   runat="server" 
                   value='<%# Eval("StartDate", "{0:yyyy-MM-dd HH:mm:ss}") %>' />
            <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </span>
        </div>
    </ItemTemplate>
</asp:TemplateField>

小细节：给每个DateTimePicker的容器ID加上<%# Container.DataItemIndex %>，避免页面出现重复ID；同时把input设为服务器控件（runat="server"），这样后台才能直接获取它的输入值。

第二步：后台获取值并完成类型转换 #

接下来分两种常见场景，教你怎么获取并转换日期值：

场景1：在GridView的RowCommand事件里获取 #

如果是通过按钮触发的行操作，比如编辑、提交，可以这么写：

protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
    if (e.CommandName == "YourCustomCommand")
    {
        // 获取当前行索引
        int rowIndex = Convert.ToInt32(e.CommandArgument);
        GridViewRow targetRow = GridView1.Rows[rowIndex];
        
        // 找到对应的日期输入控件
        HtmlInputText txtStartDate = (HtmlInputText)targetRow.FindControl("txtStartDate");
        
        // 转换为DateTime类型，用TryParse避免格式错误崩溃
        DateTime startDate;
        if (DateTime.TryParse(txtStartDate.Value, out startDate))
        {
            // 转换成功，这里可以用startDate做业务逻辑，比如存数据库
            // Example: UpdateRecord(startDate);
        }
        else
        {
            // 处理日期格式错误的情况，比如给用户弹提示
            ClientScript.RegisterStartupScript(this.GetType(), "dateAlert", "alert('请输入有效的日期格式哦！');", true);
        }
    }
}

场景2：遍历GridView所有行批量获取 #

如果需要批量处理所有行的日期值，可以这么做：

foreach (GridViewRow row in GridView1.Rows)
{
    if (row.RowType == DataControlRowType.DataRow)
    {
        HtmlInputText txtStartDate = (HtmlInputText)row.FindControl("txtStartDate");
        DateTime startDate;
        
        // 用TryParseExact指定格式，转换更精准，避免因系统区域设置导致的问题
        if (DateTime.TryParseExact(txtStartDate.Value, "yyyy-MM-dd HH:mm:ss", 
            System.Globalization.CultureInfo.InvariantCulture, 
            System.Globalization.DateTimeStyles.None, out startDate))
        {
            // 这里写你的批量处理逻辑
        }
    }
}

额外小提示：前后端格式统一更稳妥 #

为了避免转换时出现格式不匹配的问题，建议前端初始化DateTimePicker时指定固定格式，和后台转换的格式保持一致：

$(function () {
    // 初始化所有日期选择器
    $('.input-group.date').each(function () {
        $(this).datetimepicker({
            format: 'YYYY-MM-DD HH:mm:ss' // 和后台TryParseExact的格式对应
        });
    });
});

这样操作下来，就能像处理普通TextBox一样，顺利完成DateTimePicker的值获取和类型转换啦！

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