AJAX textbox calendar to control contents of Gridview

Last post 01-20-2009 3:21 PM by tbplayer22. 2 replies.

Sort Posts:

  • AJAX textbox calendar to control contents of Gridview

    01-20-2009, 2:58 PM
    • Member
      14 point Member
    • tbplayer22
    • Member since 12-18-2007, 9:39 AM
    • Posts 53

    I have events in a gridview that are displayed based on the date.  When the page starts up the default date is today and is inserted into the text box that has a AJAX calendar control on it.  The gridview's control paramater is the text box.  When the page starts up the events for today show without a problem.  When I hit the ajax calendar button and change the date from the calendar the text box that it is bound to changes the date, but the gridview does not change it's contents.  It should change it's data to the events for the date now selected, but nothing fires.  Thanks in advance.  Here is the code:

     <asp:SqlDataSource ID="DS_EventAllDay_Today" runat="server"
            ConnectionString="<%$ ConnectionStrings:newTekRRconnectionString %>"
            SelectCommand="sp_GetToDoEventAllDay_Today"
            SelectCommandType="StoredProcedure"
            DeleteCommand="sp_UpdateToDoListToDelete" DeleteCommandType="StoredProcedure">
            <SelectParameters>
                <asp:ControlParameter ControlID="TextBoxCalendar" Name="date"
                    PropertyName="Text" Type="String" />
            </SelectParameters>
            <DeleteParameters>
                <asp:Parameter Name="id" Type="Int32" />
                <asp:ControlParameter ControlID="LabelHiddenUser" Name="delUserName" Type="String" />
                <asp:Parameter name="deleted" Type="Int32" DefaultValue="1" />
            </DeleteParameters>
        </asp:SqlDataSource>

    <asp:UpdatePanel ID="CalendarPanel" runat="server" UpdateMode="Always">
                <ContentTemplate>
                 <asp:Label ID="Label6" runat="server" Text="NewTek Today" Font-Bold="true"
                     Font-Size="XX-Large" ></asp:Label><br />
                    <asp:TextBox ID="TextBoxCalendar" runat="server"  ></asp:TextBox>
                    <asp:ImageButton runat="Server" ID="Image1" ImageUrl="~/images/Calendar_scheduleHS.png"
                    AlternateText="Click to show calendar" /><br />
                     <ajaxToolkit:CalendarExtender ID="TextBoxCalendar_CalendarExtender" 
                        runat="server" Enabled="True" TargetControlID="TextBoxCalendar" PopupButtonID="Image1">
                    </ajaxToolkit:CalendarExtender>
                    </ContentTemplate>
                    </asp:UpdatePanel>

    <asp:UpdatePanel ID="up1" runat="server" UpdateMode="Conditional" >
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="TextBoxCalendar"  />
            </Triggers>
                <ContentTemplate>
       
                    <asp:GridView ID="GridView1" runat="server" 
                        AutoGenerateColumns="False" DataKeyNames="id" DataSourceID="DS_EventAllDay_Today"
                        ShowHeader="False" Width="100%" BackColor="Azure" GridLines="None" >
                        <Columns>
                            <asp:TemplateField>
                                <ItemTemplate>
                                    <asp:Panel CssClass="popupMenu" ID="PopupMenu" runat="server">
                                        <div style="border:1px outset white;padding:2px;">
                                            <div><asp:LinkButton ID="LinkButton1" runat="server" CommandName="Edit" Text="Edit" /></div>
                                            <div><asp:LinkButton ID="LinkButton2" runat="server" CommandName="Delete" Text="Delete"
                                                  OnClientClick='return confirm("Are you sure you want to delete this item?");'/></div>
                                        </div>
                                    </asp:Panel>

                                    <asp:Panel ID="Panel9" runat="server">
                                        <table width="100%">
                                            <tr>
                                                <td width="10%"><asp:Label Font-Bold="true" ID="Label1" runat="server"
                                                    Text='<%# Eval("Name") %>' /></td>
                                                <td width="10%"><asp:Label ID="Label2" runat="server"
                                                    Text='<%# Eval("Type") %>' /></td>
                                                <td width="10%"><asp:Label ID="Label3" runat="server" Text='<%# Eval("Resource") %>' /></td>
                                                <td width="10%"><asp:Label ID="Label4" runat="server" Text='<%# Eval("Department") %>' /></td>
                                                <td width="15%"><asp:Label ID="Label5" runat="server" Text='<%# Eval("Notes") %>' /></td>
                                            </tr>
                                        </table>
                                    </asp:Panel>

                                    <ajaxToolkit:HoverMenuExtender ID="hme2" runat="Server"
                                        HoverCssClass="popupHover"
                                        PopupControlID="PopupMenu"
                                        PopupPosition="Left"
                                        TargetControlID="Panel9"
                                        PopDelay="25" />
                                </ItemTemplate>
                                <EditItemTemplate> 
                                    <asp:Panel ID="Panel9" runat="server" Width="80%">
                                        <table width="100%">
                                            <tr>
                                                <td width="30%">Title:<br /><asp:TextBox Font-Bold="true" ID="TextBox1" runat="server"
                                                    Text='<%# Bind("Title") %>' Width="100" /></td>
                                                <td width="55%">Desc:<br /><asp:TextBox ID="TextBox2" runat="server"
                                                    Text='<%# Bind("Description") %>' Width="150" /></td>
                                                <td width="15%">Pri:<br /><asp:TextBox ID="TextBox3" runat="server"
                                                    Text='<%# Bind("Priority") %>' Width="40" /></td>
                                            </tr>
                                        </table>
                                    </asp:Panel>

                                    <ajaxToolkit:HoverMenuExtender ID="hme1" runat="Server"
                                        TargetControlID="Panel9"
                                        PopupControlID="PopupMenu"
                                        HoverCssClass="popupHover"
                                        PopupPosition="Right" />
                                  
                                    <asp:Panel ID="PopupMenu" runat="server" CssClass="popupMenu" Width="80">
                                        <div style="border:1px outset white">
                                            <asp:LinkButton ID="LinkButton1" runat="server"
                                                CausesValidation="True" CommandName="Update" Text="Update" />
                                            <br />
                                            <asp:LinkButton ID="LinkButton2" runat="server"
                                                CausesValidation="False" CommandName="Cancel" Text="Cancel" />
                                        </div>
                                    </asp:Panel>
                                </EditItemTemplate>
                            </asp:TemplateField>
                        </Columns>
                    </asp:GridView>
                   
                </ContentTemplate>
            </asp:UpdatePanel>   

    Code Behind:

    protected void Page_Load(object sender, EventArgs e)
        {
            DateTime dt = DateTime.Today;
            string today = dt.ToString("MM-dd-yyyy");

    TextBoxCalendar.Text = today; }

  • Re: AJAX textbox calendar to control contents of Gridview

    01-20-2009, 3:15 PM
    Answer
    • Contributor
      2,252 point Contributor
    • jsriharsha
    • Member since 07-17-2008, 8:05 PM
    • Posts 452

    there are two things you missed ...

    tbplayer22:
    <asp:TextBox ID="TextBoxCalendar" runat="server"  ></asp:TextBox>

    set the autopostback = ture for the textbox

    tbplayer22:
    <asp:AsyncPostBackTrigger ControlID="TextBoxCalendar"  />

    set the EventName to text changed event of the "textboxcalender"

    <asp:AsyncPostBackTrigger ControlID="TextBoxCalendar" EventName ="TextBoxCalendar_TextChanged" />

    Sri
    Please mark as answer if it helped you
  • Re: AJAX textbox calendar to control contents of Gridview

    01-20-2009, 3:21 PM
    • Member
      14 point Member
    • tbplayer22
    • Member since 12-18-2007, 9:39 AM
    • Posts 53

     Thanks man I actually did have the TextChanged part in there.  It's just that I had been messing with the code just before I copied and pasted into the forum.  Anyway the autopostback solved my problem.  Thanks for your help.  Something so easy yet sometimes our eyes just skim over it.  Always nice to have another set of eyes.  Thanks. 

Page 1 of 1 (3 items)
Microsoft Communities