首页 文章

Telerik ASP.Net Radgrid显示/隐藏过滤器

提问于
浏览
1

我在运行时基于传入的配置构建ASP.Net Telerik Radgrid,因此我的ASPX页面上没有radgrid标记 . 我正在尝试实现功能,我可以在网格的 Headers 中添加一个按钮来显示或隐藏列过滤器 .

我正在使用Command Item Template提供显示/隐藏按钮,但是当我单击按钮使用 ShowHideFilters Javascript方法使用grid.get_masterTableView()函数显示或隐藏过滤器时,它无法在网格对象上找到 get_masterTableView() 方法 .

知道为什么缺少这种方法或者更好的替代方法来实现我需要的行为吗?

Telerik Radgrid Client API

JavaScript example from Telerik API

function getMasterTableView() {
    var grid = $find("<%=RadGrid1.ClientID %>");
    var masterTableView = grid.get_masterTableView();              
}

Page

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="ShowGrid.aspx.vb" Inherits="ShowGrid" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>

    <form id="ShowGrid" runat="server">

        <telerik:RadScriptManager ID="ScriptManager" runat="server">
        </telerik:RadScriptManager>

        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="ConfigureGrid">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="ConfigureGrid" LoadingPanelID="AjaxLoadingPanel" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>

        <telerik:RadAjaxLoadingPanel ID="AjaxLoadingPanel" runat="server"/>

        <asp:SqlDataSource ID="PrimaryDataSource" runat="server"/>
    </form>

    <script type="text/javascript">

        function ShowHideFilters()
        {
            var grid = document.getElementById("ConfigureGrid")
            if (grid)
            {
                var masterTableView = grid.get_masterTableView();
                window.alert(masterTableView.id)
            }

            window.alert(grid.id)
        }

    </script>

</body>
</html>

Code behind

在Page_Init中从头开始构建网格

Protected Sub Page_Init(sender As Object, e As EventArgs) Handles Me.Init

    Try
        BuildConfiguration()
        CreateTitleObject()
        CreateRadFilter()
        LoadDataSource()
        CreateRadGrid()
    Catch ex As Exception
        CreateExceptionDisplay(ex)
    End Try

End Sub

Item template

Friend Class RadGridCommandItemFilterTemplate
    Implements ITemplate

    Protected showHideFilterButton As Button

    Public Sub New()
        MyBase.New()
    End Sub

    Public Sub InstantiateIn(ByVal container As Control) Implements ITemplate.InstantiateIn
        showHideFilterButton = New Button
        showHideFilterButton.EnableTheming = True
        showHideFilterButton.ID = "showHideFilterButton"
        showHideFilterButton.Text = "Show / Hide Filters"
        showHideFilterButton.CommandName = "ShowHideFilters"
        showHideFilterButton.OnClientClick = "ShowHideFilters()"
        container.Controls.Add(showHideFilterButton)
    End Sub

End Class

Adding the item template

grid.MasterTableView.CommandItemTemplate = New RadGridCommandItemFilterTemplate

2 回答

  • 1

    请检查您是否具有正确的网格ID以及是否使用$ find方法 . 提供的代码有点乱,我不确定调用哪个部分 .

    在函数getMasterTableView中你使用$ find但我猜错了你的id . 此外,如果此函数在javascript文件中,则“<%= RadGrid1.ClientID%>”将无法解析为更正ID . 必须在aspx文件中才能这样做 .

    在函数ShowHideFilters中使用错误函数getElementById将返回DOM对象而不是Telerik . 另请注意,您的网格具有“TestGrid”ID .

    更新:要获得主表,您需要使用find方法 . 如果你想要更通用的解决方案,那么我建议你在你的按钮上添加简单的css类 . 然后在onLoad事件中为这些按钮添加处理程序 . 如果你有jQuery元素放在网格中,那么你可以使用以下函数动态定位网格:

    function getParentGrid($element) {
        var $parentGrid = $element.closest("div.RadGrid");
        var parentGridId = $parentGrid[0].id;
        return  window.$find(parentGridId);
    }
    
  • 0

    在Telerik支持的帮助下,我想出了这个 .

    Item template

    Friend Class RadGridCommandItemFilterTemplate
        Implements ITemplate
    
        Public showHideFilter As ImageButton
        Public bannerTitle As Label
    
        Private gridClientID As String
        Private showFilter As Boolean = False
        Private title As String = String.Empty
    
        Public Sub New()
            MyBase.New()
        End Sub
    
        Public Sub New(gridClientID As String, showfilter As Boolean, title As String)
            MyBase.New()
            Me.gridClientID = gridClientID
            Me.showFilter = showfilter
            Me.title = title
        End Sub
    
        Public Sub InstantiateIn(ByVal container As Control) Implements ITemplate.InstantiateIn
    
            If Not String.IsNullOrWhiteSpace(title) Then
                bannerTitle = New Label With {.Text = title, .CssClass = "title"}
                container.Controls.Add(bannerTitle)
            End If
    
            If showFilter Then
                showHideFilter = New ImageButton With {.ID = "showHideFilter",
                                                     .CommandName = "ShowHideFilters",
                                                     .CssClass = "searchButton"}
    
                showHideFilter.Attributes.Add("onclick", (Convert.ToString("setFilter('") & gridClientID) + "'); return false;")
    
                container.Controls.Add(showHideFilter)
            End If
    
        End Sub
    
    End Class
    

    Java script

    <script type="text/javascript">
    
        function pageLoad(sender, args) {
            setFilter('ConfigureGrid');
        }
    
        function setFilter(gridClientID) {
            var grid = $find(gridClientID);
            if (grid.get_masterTableView().get_isFilterItemVisible()) {
                grid.get_masterTableView().hideFilterItem();
            }
            else {
                grid.get_masterTableView().showFilterItem()
            }
        }
    </script>
    

相关问题