Replacing HeaderText with Headertemplate in TemplateField - sorting

I have a gridview with templatefield columns. The TemplateFields are something like this:
<asp:TemplateField HeaderText="Title" SortExpression="name" meta:resourcekey="BoundFieldResource1">
<ItemTemplate>
<asp:Label ID="lblTitle" runat="server" Text='<%# Bind("Name") %>' meta:resourcekey="BoundFieldResource1"></asp:Label>
</ItemTemplate>
</TemplateField>
I have to add a custom attribute for to the header of this columns so I removed HeaderText and added the following:
<Headertemplate>
<asp:Label ID="lblTitleHeading" runat="server" Text="Title" data-custom="tbl-th_title_heading"></asp:Label>
</Headertemplate>
My problem is when I do this, it will break the sorting of that column and I cannot click on the header to sort it anymore, I tried changing the asp:Label to asp:LinkButton but that didn't do anything.
I would appreciate your answers.

Ok I just found out how to do this, I just needed to change the Label to LinkButton and add CommandName="Sort" and CommandArgument="name" (or any SortExpression)
<Headertemplate>
<asp:LinkButton ID="lblTitleHeading" runat="server" Text="Title" data-custom="tbl-th_title_heading" CommandName="Sort" CommandArgument="name"></asp:LinkButton>

Related

Rebind detailtable in radgrid

i have a radgrid with detailtables ,
detailTable has "GridEditCommandColumn" and another "GridTemplateColumn" that contains linkbutton to remove row ,
<MasterTableView DataKeyNames="FEATURE_ID">
<Columns>
<telerik:GridBoundColumn DataField="FEATURE_ID" UniqueName="FeatureID" ></telerik:GridBoundColumn>
</Columns>
<DetailTables>
<telerik:GridTableView ShowHeader="true" CommandItemDisplay="Top"
SkinID="RadGridSkin" Width="100%" runat="server" Name="Fees"
EditMode="InPlace">
<Columns>
<telerik:GridEditCommandColumn></telerik:GridEditCommandColumn>
<telerik:GridBoundColumn DataField="FEE_TEMPLATE_ID" UniqueName="FeeID"></telerik:GridBoundColumn>
<telerik:GridTemplateColumn UniqueName="DeleteFee">
<ItemTemplate>
<asp:LinkButton ID="RemoveFee" runat="server" CommandName="RemoveFee" Text="RemoveFee" ImageUrl="../../../images/cancel.png" ToolTip="<%$Resources:Strings,remove %>" />
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</telerik:GridTableView>
</DetailTables>
</MasterTableView>
in code behind in itemCommand event :
dataSource of radgrid is updated and Datable.acceptchanges() is called ;
how to rebind only the detailTable where changes have occurred ??
You didn't supply the name of your RadGrid, but the first thing I would try is:
RadGrid1.MasterTableView.DetailTables(0).Rebind(),
or, although I'm not sure whether this works for you (it compiles in VS for me), you might be able to say:
RadGrid1.MasterTableView.DetailTables("Fees").Rebind().
Obviously, replace 'RadGrid1' with the name of your RadGrid.

C# Asp.net Ajaxcontroltoolkit multiple Accordion Panels. Show or Hide last panel if a checkbox is selected in first panel

<ajaxToolkit:Accordion ID="Accordion1" CssClass="accordion" SelectedIndex="0" HeaderCssClass="accordionHeader" HeaderSelectedCssClass="accordionHeaderSelected" AutoSize="None" RequireOpenedPane="false" ContentCssClass="accordionContent" runat="server">
<Panes>
<ajaxToolkit:AccordionPane ID="Pane1" runat="server">
<Header><b>Panel 1</b></Header>
<Content>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<br>
Age: <asp:textbox id="Age1" runat="server" Width="35" Font-Bold="True"/><br>
Attorney: <asp:CheckBox ID="Attorney" runat="server" /><br>
<asp:button ID="Button1" text="Submit" OnClick="Button1_Click"
runat="server"/><br>
<asp:label id="Message1" runat="server" ForeColor="White" Font-Size="Small" Font-Bold="True"/>
</ContentTemplate>
</asp:UpdatePanel>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPane ID="Pane2" runat="server">
<Header><b>Panel 2</b></Header>
<Content>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<br>
<asp:textbox id="Age2" runat="server" Width="35" Font-Bold="True"/><br>
<asp:button ID="Button2" text="Submit" onclick="Button2_Click"
runat="server"/><br><br>
<asp:label id="Message2" runat="server" ForeColor="White" Font-Size="Small" Font-Bold="True" />
</ContentTemplate>
</asp:UpdatePanel>
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
protected void Button1_Click(object sender, EventArgs e) {
if (Attorney.Checked) {
Pane2.Visible = true;
} else {
Pane2.Visible = false;
}
//Message1.Text = Age1.Text;
}
I have five Accordion Panels. Last Panel should be displayed only if a checkbox is checked in the first panel. Inside each Accordion Panel I have a UpdatePanel and within that I have ContentTemplate with controls and submit button particular to that accordion panel. The reason I added UpdatePanel is so that when i update a particular panel it does not affect other accordion panels.
The problem is I need to toggle last accordion panel display depending upon if a checkbox is checked in the first Panel and submit button is clicked. In Code behind, in the btnSubmit1 event...I have code that says if checkbox is checked....Pane2.Visible = true else Pane2.Visible=false. For some reasons it still shows the LastPanel.
I am not sure where am I going wrong...please advise!
Thanks!
Jini
I fixed the problem by adding an outer update panel...and removed the updatepanel for Panel 2. Haven't tested it thoroughly but so far looks good.
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:UpdatePanel ID="OuterPanel" UpdateMode="Always" ChildrenAsTriggers="true" runat="server">
<ContentTemplate>
<ajaxToolkit:Accordion ID="Accordion1" CssClass="accordion" SelectedIndex="0" HeaderCssClass="accordionHeader"
HeaderSelectedCssClass="accordionHeaderSelected" AutoSize="None" RequireOpenedPane="false" ContentCssClass="accordionContent" runat="server">
<Panes>
<ajaxToolkit:AccordionPane ID="Pane1" runat="server">
<Header><b>Panel 1</b></Header>
<Content>
<br>
Age: <asp:textbox id="Age1" runat="server" Width="35" Font-Bold="True" /><br />
Attorney: <asp:CheckBox ID="Attorney" runat="server" /><br>
<asp:button ID="Button1" text="Submit" OnClick="Button1_Click"
runat="server"/><br>
<asp:label id="Message1" runat="server" ForeColor="White" Font-Size="Small" Font-Bold="True"/>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPane ID="Pane2" runat="server">
<Header><b>Panel 2</b></Header>
<Content>
<br>
<asp:textbox id="Age2" runat="server" Width="35" Font-Bold="True"/>
<asp:button ID="Button2" text="Submit" onclick="Button2_Click"
runat="server"/><br><br>
<asp:label id="Message2" runat="server" ForeColor="White" Font-Size="Small" Font-Bold="True" />
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>
</ContentTemplate>
I'd like to see your code to be sure, but I'm expecting it's because you have an UpdatePanel in each of the AccordionPanels. Once an event happens in one UpdatePanel, ASP.NET will not run code handling that event that is attached to another UpdatePanel.
First, I'd take out all UpdatePanels to see if your code works as expected. Then, I'd add one UpdatePanel wrapped around the entire Accordion and see if your code still works.
If you really decided you need to have 5 UpdatePanels, look into the <Triggers> portion of the UpdatePanel. You'll be able to provide the CheckBox's ID to force the other associated UpdatePanel to PostBack.

Add new record button in RadGrid

I follow this demo on how to create grid with my custom New Item control. I have quite easy question - where do I define New record button, just like this one in demo?
If the RadGrid's attribute AllowAutomaticInserts is set to True, and the grid is using a declarative data source, you'll get the default "Add New" button and behavior. This is what's happening in the demo you linked. You can control its appearance in several ways.
The "command items" (add, delete, edit, etc.) associated with the grid are controlled by the grid's CommandItemTemplate element. By default the look of this element will be based on the skin you have applied to the Telerik controls. It can also be controlled with various style elements.)
The CommandItemTemplate can be customized to show custom buttons, nonstandard text, and so forth. Here's an example from Telerik's documentation on it. Note that the CommandName attribute determines what function is performed by the button.
<CommandItemTemplate>
Custom command item template
<asp:LinkButton Style="vertical-align: bottom" ID="btnEditSelected" runat="server"
CommandName="EditSelected" Visible='<%# RadGrid1.EditIndexes.Count == 0 %>'><img style="border:0px" alt="" src="../../DataEditing/Img/Edit.gif" /> Edit Selected Customers</asp:LinkButton>
<asp:LinkButton ID="btnUpdateEdited" runat="server" CommandName="UpdateEdited" Visible='<%# RadGrid1.EditIndexes.Count > 0 %>'><img style="border:0px" alt="" src="../../DataEditing/Img/Update.gif" /> Update Customers</asp:LinkButton>
<asp:LinkButton ID="btnCancel" runat="server" CommandName="CancelAll" Visible='<%# RadGrid1.EditIndexes.Count > 0 || RadGrid1.MasterTableView.IsItemInserted %>'><img style="border:0px" alt="" src="../../DataEditing/Img/Cancel.gif" /> Cancel editing</asp:LinkButton>
<asp:LinkButton ID="LinkButton3" runat="server" CommandName="InitInsert" Visible='<%# !RadGrid1.MasterTableView.IsItemInserted %>'><img style="border:0px" alt="" src="../../DataEditing/Img/AddRecord.gif" /> Add new Customer</asp:LinkButton>
<asp:LinkButton ID="LinkButton4" runat="server" CommandName="PerformInsert" Visible='<%# RadGrid1.MasterTableView.IsItemInserted %>'><img style="border:0px" alt="" src="../../DataEditing/Img/Insert.gif" /> Add this Customer</asp:LinkButton>
<asp:LinkButton ID="LinkButton5" OnClientClick="javascript:return confirm('Delete all selected customers?')"
runat="server" CommandName="DeleteSelected"><img style="border:0px" alt="" src="../../DataEditing/Img/Delete.gif" /> Delete Selected Customers</asp:LinkButton>
<asp:LinkButton ID="LinkButton6" runat="server" CommandName="Re bindGrid"><img style="border:0px" alt="" src="../../DataEditing/Img/Refresh.gif" /> Refresh customer list</asp:LinkButton>
<br />
</CommandItemTemplate>
Also, the grid's MasterTableView contains an attribute, CommandItemDisplay, which can be used to control the button placement - values are None, Top, TopAndBottom, or Bottom:
<MasterTableView CommandItemDisplay="Top" ....>

How do I sort a DataGrid column based on a field in an embedded Repeater?

I have a DataGrid which has one column that derives its contents from a Repeater that is populated during the DataGrid's ItemDataBound event. I need to be able to sort the DataGrid rows based on the value in the Repeater. Here is a shortened sample of the DataGrid:
<DataGrid id="dgResults" Runat="server" AllowSorting="true">
<Columns>
<asp:boundcolumn HeaderText="ID" datafield="group_id" Visible="False" />
<asp:BoundColumn HeaderText="Group" DataField="group_name" SortExpression="group_name" />
<asp:TemplateColumn SortExpression="meeting_start_time">
<HeaderTemplate>
<asp:LinkButton CommandName="Sort" Text="Time" CausesValidation="False" runat="server" />
</HeaderTemplate>
<ItemTemplate>
<asp:Repeater ID="Schedule_Repeater" runat="server">
<ItemTemplate>
<%# Eval("meeting_start_time", "{0:t}")%>
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</DataGrid>
As you can see, the third column contains the meeting_start_time, whose value is displayed via a Repeater.
How do I tell the DataGrid to sort the "Time" column by the meeting_start_time values in the Repeater?

GridView sorting with Template Field and Header Template

I'm using GridView and there is a dropdownlist in header cell for filtering.
<gm:GridView ID="routePlanGridView" runat="server" AutoGenerateColumns="False"
AllowPaging="true" PageSize="20" GridLines="Both" ShowFooter="true" CssClass="grid"
DataKeyNames="RoutePlanId" OnSorting="routePlanGridView_Sorting"
AllowSorting="true" OnPageIndexChanging="routePlanGridView_PageIndexChanging"
OnSelectedIndexChanging="routePlanGridView_SelectedIndexChanging"
OnRowDataBound="routePlanGridView_RowDataBound"
OnRowEditing="routePlanGridView_RowEditing"
OnRowUpdating="routePlanGridView_RowUpdating">
<HeaderStyle CssClass="gridHeaderFooter" />
<FooterStyle CssClass="gridHeaderFooter" />
<RowStyle CssClass="gridRow" />
<AlternatingRowStyle CssClass="gridRowAlternate" />
<Columns>
<asp:TemplateField SortExpression="SPName">
<HeaderTemplate>
SP Name<br />
<asp:DropDownList ID="spNameFilterDDL" runat="server" CssClass="gridControl" AutoPostBack="true" DataSourceID="SPNameSDS" DataTextField="SPName" OnDataBound="filterDDL_DataBound" OnSelectedIndexChanged="spNameFilterDDL_SelectedIndexChanged" />
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="spNameLabel" runat="server" Text='<%# Bind("SPName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<...15 more...>
</Columns>
</gm:GridView>
and there are relevant event handlers for sorting and paging.
Now the problem is if I put "SP Name" text in a link button, page crashes when link clicked, otherwise no link produced to sort.
If I remove Header Template fields (all of them) and put a text with HeaderText attribute of TemplateField it works as expected. Is there a way to put them together? I need that dropdown and also sorting.
Thanks.
sorry, forgot to insert the code correctly - here:
<asp:LinkButton runat="server" Text="SP Name" CommandName="Sort" CommandArgument="SPName" ></asp:LinkButton>
You need to use a link button for your header text. So in place of "SP Name", use . It should work if you are handling sorting.

Resources