datepicker updating from itemtemplate

Question

I have code to update a date from a sqldatasource updateCommand.

Code:

<asp:GridView ID="gdLog" runat="server" GridLines="Horizontal" CellPadding="3" CssClass="gridRows" HeaderStyle-CssClass="gridHreader" AlternatingItemStyle-CssClass="gridAlterRows" Width="100%" AutoGenerateColumns="False" AutoGenerateEditButton="True" DataKeyNames="hometemplateID" DataSourceID="SqlDataSource1">
    <Columns>
        <asp:BoundField DataField="hometemplateID" HeaderText="hometemplateID" InsertVisible="False" ReadOnly="True" SortExpression="hometemplateID" Visible="False" />
        <asp:BoundField DataField="ttitle" HeaderText="title" SortExpression="ttitle" />

         <asp:TemplateField HeaderText="start">
            <ItemTemplate>
                <asp:Label runat="server" ID="tstart" 
                  Text='<%# makeShortDate(DataBinder.Eval(Container.DataItem, "tstart")) %>'>
                </asp:Label>
            </ItemTemplate>
            <EditItemTemplate>
                  <asp:TextBox ID="tStartdEdit" runat="server" class="form-control calender-icon datepicker date" Text='<%# makeShortDate(DataBinder.Eval(Container.DataItem, "tstart")) %>'></asp:TextBox>
            </EditItemTemplate>
          </asp:TemplateField>


         <asp:TemplateField HeaderText="end">
            <ItemTemplate>
                <asp:Label runat="server" ID="tend" 
                  Text='<%# makeShortDate(DataBinder.Eval(Container.DataItem, "tend")) %>'>
                </asp:Label>
            </ItemTemplate>
            <EditItemTemplate>
                  <asp:TextBox ID="tendEdit" runat="server" class="form-control calender-icon datepicker date" Text='<%# makeShortDate(DataBinder.Eval(Container.DataItem, "tend")) %>'></asp:TextBox>
            </EditItemTemplate>
          </asp:TemplateField>

        <asp:CheckBoxField DataField="tActive" HeaderText="Active" SortExpression="tActive" />
        <asp:BoundField DataField="tdatecreated" HeaderText="date added" InsertVisible="False" ReadOnly="True" SortExpression="tdatecreated" />
    </Columns>
    <HeaderStyle CssClass="gridHreader">
    </HeaderStyle>
</asp:GridView>

                        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:Dbconnection %>" SelectCommand="EXEC [usp_SelectHomePageItems] @templateid=1, @rows=1" UpdateCommand="update hometemplate set title=@ttitle, startdate=@tstart, isActive=@tActive where hometemplateID=@hometemplateID">
                            <UpdateParameters>                                    
                                <asp:Parameter Name="tstart" />
                                <asp:Parameter Name="tend" /> 
                            </UpdateParameters>
                        </asp:SqlDataSource>

There are 2 datepickers (start and end). I need to use makeShortDate function to format the text for the datepicker(s) because when I pick from it, it seems to use the format month namespacedayspaceyear

If I don't do that, and simply use Bind("tstart") on edititemtemplate, then after I hit 'edit', it shows in the textbox as 25/7/2018 12:00:00 AM....day first for some reason, and I don't want that to confuse my customers. It's also ugly showing the 12am stuff. It also selects the wrong date when I click the calender icon, whereas if I format first, it selects the right one.

When I try my code as is, the date gets set to blank for some reason. I think I need to Bind on the edititemTemplate but as mentioned I need to format the date with the function makeShortdate.

So how do I get the textbox for the dates to be month/day/year after hit 'edit' instead of the day/month/year 12:00:00am thing? I can do it with the makeshortdate function but then the date is set to null for some reason.

Sorry about the code indent, not sure how to de-indent a block of code on here.

The datepicker is datepicker for bootstrap. In the header I use:

$(function () {
   $('.datepicker').datepicker({
       format: 'MM dd yyyy',
       autoclose: true,
   });
});

Answer 1

ok got it with formatting:

                                 <asp:TemplateField HeaderText="start">
                                    <ItemTemplate>
                                        <asp:Label runat="server" ID="tstart" DataField="startdate"
                                          Text='<%# DataBinder.Eval(Container.DataItem, "startdate","{0:MMM dd yyyy}") %>'>
                                        </asp:Label>
                                    </ItemTemplate>
                                    <EditItemTemplate >
                                          <asp:TextBox ID="tStartdEdit" runat="server" class="form-control calender-icon datepicker date" Text='<%# Bind("startdate","{0:MMM dd yyyy}") %>'></asp:TextBox>
                                    </EditItemTemplate>
                                  </asp:TemplateField>