| <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> |
| <%@ Register Assembly="RadSplitter.Net2" Namespace="Telerik.WebControls" TagPrefix="telerik" %> |
| <%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" |
| Namespace="System.Web.UI" TagPrefix="asp" %> |
| <html > |
| <head id="Head1" runat="server"> |
| </head> |
| <body class="BODY"> |
| <form id="Form1" method="post" runat="server"> |
| <asp:ScriptManager ID="ScriptManager" runat="server" /> |
| <br /> |
| <telerik:RadSplitter ID="RadSplitter1" runat="server" Width="700" Height="500"> |
| <telerik:RadPane ID="LeftPane" runat="server" Width="22" Scrolling="none" Locked="true"> |
| <telerik:RadSlidingZone ID="SlidingZone1" runat="server" Width="22"> |
| <telerik:RadSlidingPane ID="RadSlidingPane1" Title="Pane1" runat="server" Width="150"> |
| Pane 1 Content |
| </telerik:RadSlidingPane> |
| </telerik:RadSlidingZone> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="Radsplitbar1" runat="server"></telerik:RadSplitBar> |
| <telerik:RadPane ID="MiddlePane1" runat="server" Scrolling="None"> |
| Main Content |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| <br /> |
| </form> |
| </body> |
| </html> |
<
form id="form1" runat="server">
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
<!--
function RowSelected(sender, args) {
document.getElementById(
"<%= Label1.ClientID %>").innerHTML = "<b>ID: </b>" + args.getDataKeyValue("number");
}
-->
</script>
</telerik:RadCodeBlock>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<!-- content start -->
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadGrid1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadGrid1" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadCodeBlock runat="server" ID="radCodeBlock">
<script type="text/javascript">
function showFilterItem(){
$find(
'<%=RadGrid1.ClientID %>').get_masterTableView().showFilterItem();
}
function hideFilterItem(){
$find(
'<%=RadGrid1.ClientID %>').get_masterTableView().hideFilterItem();
}
</script>
</telerik:RadCodeBlock>
<div>
Show filtering item
<input id="Radio1" type="radio" runat="server" name="showHideGroup" checked="true" onclick="showFilterItem()" /><label for="Radio1">Yes</label>
<input id="Radio2" type="radio" runat="server" name="showHideGroup" onclick="hideFilterItem()"/><label for="Radio2" >No</label>
</div>
<br/>
<telerik:RadGrid AutoGenerateColumns="false" ID="RadGrid1"
Width="760px" AllowFilteringByColumn="True" AllowSorting="True"
PageSize="15" ShowStatusBar="true" ShowFooter="True" AllowPaging="True" runat="server"
GridLines="None" EnableLinqExpressions="false" OnNeedDataSource="RadGrid1_NeedDataSource">
<PagerStyle Mode="NextPrevAndNumeric" />
<ClientSettings EnableRowHoverStyle="true">
<Selecting AllowRowSelect="True" />
<ClientEvents OnRowSelected="RowSelected" />
</ClientSettings>
<GroupingSettings CaseSensitive="false" />
<MasterTableView AutoGenerateColumns="false" EditMode="InPlace" AllowFilteringByColumn="True"
ShowFooter="True" TableLayout="Auto" AllowMultiColumnSorting="true" ClientDataKeyNames="number">
<Columns>
<telerik:GridNumericColumn DataField="number" AutoPostBackOnFilter="true" HeaderText="id" SortExpression="number"
UniqueName="number" FilterControlWidth="40px" CurrentFilterFunction="equalto" ShowFilterIcon="true">
</telerik:GridNumericColumn>
<telerik:GridBoundColumn FilterControlWidth="50px" DataField="title" HeaderText="title" SortExpression="title"
UniqueName="title" CurrentFilterFunction="Contains">
<FilterTemplate>
<telerik:RadComboBox ID="RadComboBoxTitle" DataTextFormatString="" DataTextField="title"
DataValueField="title" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("title").CurrentFilterValue %>'
runat="server" OnClientSelectedIndexChanged="TitleIndexChanged">
<Items>
<telerik:RadComboBoxItem Text="All" />
<telerik:RadComboBoxItem Text="Mr" Value="Mr" />
<telerik:RadComboBoxItem Text="Mrs" Value="Mrs" />
<telerik:RadComboBoxItem Text="Ms" Value="Ms" />
<telerik:RadComboBoxItem Text="Miss" Value="Miss" />
<telerik:RadComboBoxItem Text="Dr" Value="Dr" />
</Items>
</telerik:RadComboBox>
<telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">
<script type="text/javascript">
function TitleIndexChanged(sender, args) {
var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
tableView.filter(
"title", args.get_item().get_value(), "EqualTo");
}
</script>
</telerik:RadScriptBlock>
</FilterTemplate>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn FilterControlWidth="50px" DataField="forenames" HeaderText="forenames" SortExpression="forenames"
UniqueName="forenames">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn FilterControlWidth="120px" DataField="surname" HeaderText="surname" SortExpression="surname"
UniqueName="surname">
<HeaderStyle Width="160px" />
</telerik:GridBoundColumn>
<telerik:GridDateTimeColumn FilterControlWidth="100px" DataField="dob" HeaderText="dob" SortExpression="dob"
UniqueName="dob" PickerType="DatePicker" DataFormatString="{0:D}" DataType="System.DateTime">
</telerik:GridDateTimeColumn>
<telerik:GridBoundColumn FilterControlWidth="50px" DataField="sex" HeaderText="sex" SortExpression="sex"
UniqueName="sex" CurrentFilterFunction="Contains">
<FilterTemplate>
<telerik:RadComboBox ID="RadComboBoxSex" DataTextFormatString="" DataTextField="sex"
DataValueField="sex" Width="75px" AppendDataBoundItems="true" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("sex").CurrentFilterValue %>'
runat="server" OnClientSelectedIndexChanged="SexIndexChanged">
<Items>
<telerik:RadComboBoxItem Text="All" />
<telerik:RadComboBoxItem Text="Male" Value="Male" />
<telerik:RadComboBoxItem Text="Female" Value="Female" />
</Items>
</telerik:RadComboBox>
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
function SexIndexChanged(sender, args) {
var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
tableView.filter(
"sex", args.get_item().get_value(), "EqualTo");
}
</script>
</telerik:RadScriptBlock>
</FilterTemplate>
</telerik:GridBoundColumn>
</Columns>
</MasterTableView>
<ClientSettings>
<Scrolling AllowScroll="false" />
</ClientSettings>
</telerik:RadGrid>
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
<asp:Button Text="PostBack" runat="server" ID="Button1" CssClass="button" style="margin:0 20px 0;" />
Click "PostBack" to see the state of the grid is preserved.
</form>