如何在网格面板中过滤外键

时间：2012-02-29 15:44:29

标签： asp.net .net extjs ext.net

我正在使用Ext.NET GridPanel在我的系统中显示项目任务列表，每个任务都有其进度状态，如已完成，正在运行，< strong>未开始等等。

这是我的gridPanel的一部分：

enter image description here

这些进度状态是我数据库中另一个表的记录，如下所示： enter image description here

相关SprintStatus - ＆gt; SprintStatusID我正在SprintStatusName显示gridPanel。

我想做的是通过StatusName对其进行本地过滤，但我能做到这一点的唯一方法是设置我的ext:ListFilter选项及其ID（1,2,3,4），这不是'好，因为我不想显示ID

这是过滤器

enter image description here

如何让它显示StatusName而不是StatusID？

我的gridPanel代码

<ext:GridPanel 
        ID="grdProjects"
        runat="server"
        AutoHeight="true" 
        EnableColumnMove="false" 
        Collapsible="false"
        AnimCollapse="true"
        StripeRows="true" 
        Title="Projetos" >

        <Bin>
            <ext:Store ID="storeStatus" runat="server">
                <Reader>
                    <ext:JsonReader IDProperty="StatusID">
                        <Fields>
                            <ext:RecordField Name="StatusID" Type="Int" />
                            <ext:RecordField Name="StatusName" Type="String" />
                        </Fields>
                    </ext:JsonReader>
                </Reader>            
            </ext:Store>

            <ext:Store ID="storeUsers" runat="server">
                <Reader>
                    <ext:JsonReader IDProperty="DeveloperID">
                        <Fields>
                            <ext:RecordField Name="DeveloperID" Type="Int" />
                            <ext:RecordField Name="DeveloperName" Type="String" />
                        </Fields>
                    </ext:JsonReader>
                </Reader>            
            </ext:Store>
        </Bin>

        <Store>
            <ext:Store ID="ProjectsStore" runat="server" GroupField="ProjectName">
                <Reader>
                    <ext:JsonReader IDProperty="ID">
                        <Fields>
                            <ext:RecordField Name="ProjectName" Type="String" />
                            <ext:RecordField Name="ID" Type="Int" />
                            <ext:RecordField Name="Name" Type="String" />
                            <ext:RecordField Name="Status" Type="String" />
                            <ext:RecordField Name="Owner" Type="String" />
                            <ext:RecordField Name="Begin" Type="Date" />
                            <ext:RecordField Name="End" Type="Date" />
                            <ext:RecordField Name="RealEnd" Type="Date" />
                        </Fields>
                    </ext:JsonReader>
                </Reader>
            </ext:Store>
        </Store>

        <Listeners>
            <AfterEdit Fn="afterEdit" />
        </Listeners>

        <ColumnModel ID="ColumnModel20" runat="server">
            <Columns>
                <ext:Column ColumnID="SprintProject" Header="Projeto" Align="Left" DataIndex="ProjectName" />
                <ext:Column ColumnID="SprintName" Header="Nome" Align="Left" DataIndex="Name" />



                <ext:Column ColumnID="SprintStatus" Header="Status" Align="Left" DataIndex="Status">
                    <Renderer Handler="return #{storeStatus}.getById(value).data.StatusName;" />                
                    <Editor>
                        <ext:SelectBox
                            ID="selStatus"
                            StoreID="storeStatus"
                            runat="server" 
                            DisplayField="StatusName"
                            ValueField="StatusID"
                            EmptyText="Selecione um status" />
                    </Editor>
                </ext:Column>



                <ext:Column ColumnID="SprintOwner" Header="Recurso" Align="Left" DataIndex="Owner">
                    <Renderer Handler="return #{storeUsers}.getById(value).data.DeveloperName;" />
                    <Editor>
                        <ext:SelectBox
                            ID="selDevelopers"
                            StoreID="storeUsers"
                            runat="server" 
                            DisplayField="DeveloperName"
                            ValueField="DeveloperID"
                            EmptyText="Selecione um recurso" />
                    </Editor>
                </ext:Column>



                <ext:DateColumn ColumnID="SprintBegin" Header="Data de início" Align="Center" DataIndex="Begin"  Format="dd/MM/yyyy">
                    <Editor>
                        <ext:DateField Format="dd/MM/yyyy" runat="server" />
                    </Editor>
                </ext:DateColumn>



                <ext:DateColumn ColumnID="SprintEnd" Header="Previsão de término" Align="Center" DataIndex="End" Format="dd/MM/yyyy">
                    <Editor>
                        <ext:DateField Format="dd/MM/yyyy" runat="server" />
                    </Editor>
                </ext:DateColumn>



                <ext:DateColumn ColumnID="SprintRealEnd" Header="Data de término" Align="Center" DataIndex="RealEnd" Format="dd/MM/yyyy">
                    <Editor>
                        <ext:DateField Format="dd/MM/yyyy" runat="server" />
                    </Editor>
                </ext:DateColumn>



            </Columns>
        </ColumnModel>

        <SelectionModel>
            <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
        </SelectionModel>

        <View>
            <ext:GroupingView   SplitHandleWidth="10" 
                                runat="server"
                                ForceFit="true"
                                MarkDirty="false"
                                ShowGroupName="false"
                                EnableNoGroups="true"
                                HideGroupedColumn="true" ID="ctl222">



            </ext:GroupingView>




        </View>

        <Plugins>
            <ext:GridFilters runat="server" ID="GridFilters1" Local="true">
                <Filters>

                    <ext:ListFilter DataIndex="Status"  Options="1,2,3,4">
                        <Listeners>
                            <Activate Buffer="250" Fn="filtraNaoConcluido" />
                        </Listeners>
                    </ext:ListFilter>

                </Filters>
            </ext:GridFilters>
        </Plugins>

</ext:GridPanel>

1 个答案:

答案 0 :(得分：1)

这是一种使用Store为ListFilter提供选项的方法。

但是......这个样本有问题。过滤器实际上并未正确应用。我还需要做更多的研究。

一旦弄清楚到底出了什么问题，我会回来编辑这篇文章。

我还将尝试确定是否可以仅使用.Options属性设置名称：值对。

编辑：示例已更新。

示例 

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
   protected void Page_Load(object sender, EventArgs e)
   {
       if (!X.IsAjaxRequest)
       {
           var companies = new[] { 
               new { ID = 1, Name = "Company A", Size = 3 },
               new { ID = 2, Name = "Company B", Size = 1 },
               new { ID = 3, Name = "Company C", Size = 5 },
               new { ID = 4, Name = "Company D", Size = 3 },
               new { ID = 5, Name = "Company E", Size = 4 },
           };

           this.Store1.DataSource = companies;
           this.Store1.DataBind();


           var sizes = new [] { 
               new { Name = "Extra Small", ID = 1  },
               new { Name = "Small",       ID = 2  },
               new { Name = "Medium",      ID = 3  },
               new { Name = "Large",       ID = 4  },
               new { Name = "Extra Large", ID = 5  }
           };

           this.Store2.DataSource = sizes;
           this.Store2.DataBind();
       }
   }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
   <title>Ext.NET Examples</title>

   <ext:ResourcePlaceHolder runat="server" />

   <script type="text/javascript">
       var myValidateRecord = function (record) {            
           var filterValue = this.getValue(),
               item;

           if (filterValue.length == 0) {
               return true;
           }

           item = this.store.query("ID", record.data.Size).first();

           return item ? filterValue.indexOf(item.data.Name) != -1 : false;
       }
   </script>
</head>
<body>
   <ext:ResourceManager runat="server" />

   <ext:GridPanel 
       runat="server" 
       Title="Example" 
       Width="350" 
       Height="215"
       AutoExpandColumn="Name">
       <Store>
           <ext:Store ID="Store1" runat="server">
               <Reader>
                   <ext:JsonReader IDProperty="ID">
                       <Fields>
                           <ext:RecordField Name="ID" Type="Int" />
                           <ext:RecordField Name="Name" />
                           <ext:RecordField Name="Size" Type="Int" />
                       </Fields>
                   </ext:JsonReader>
               </Reader>
           </ext:Store>
       </Store>
       <Bin>
           <ext:Store ID="Store2" runat="server">
               <Reader>
                   <ext:JsonReader IDProperty="ID">
                       <Fields>
                           <ext:RecordField Name="ID" Type="Int" />
                           <ext:RecordField Name="Name" />
                       </Fields>
                   </ext:JsonReader>
               </Reader>
           </ext:Store>
       </Bin>
       <ColumnModel runat="server">
           <Columns>
               <ext:Column Header="ID" DataIndex="ID" />
               <ext:Column Header="Name" DataIndex="Name" />
               <ext:Column Header="Size" DataIndex="Size">
                   <Renderer Handler="return Store2.getById(value).data.Name" />
               </ext:Column>
           </Columns>
       </ColumnModel>
       <Plugins>
           <ext:GridFilters runat="server" Local="true">
               <Filters>
                   <ext:NumericFilter DataIndex="ID" />
                   <ext:StringFilter DataIndex="Company" />
                   <ext:ListFilter DataIndex="Size" StoreID="Store2" LabelField="Name">
                       <ValidateRecord Fn="myValidateRecord" />
                   </ext:ListFilter>
               </Filters>
           </ext:GridFilters>
       </Plugins>
   </ext:GridPanel>
</body>
</html>
相关问题
最新问题