堆栈内存溢出
  繁体   English   中英

在flex4中使用更多TextInputs过滤xmllistcollection

[英]filtering an xmllistcollection using many more TextInputs in flex4

 原文  2014-03-05 06:56:44  5   1    actionscript-3/ apache-flex/ flex4

问题描述

在我的应用程序中，我有一个带有9列的spark DataGrid，其中包括名称，ID，加入日期，DOB，体验，手机号码，电子邮件，并且每一列都有搜索字段，其中包括TextField，DateField和NumericStepper来搜索数据。 我想根据用户输入来过滤数据，这意味着我想根据用户输入来匹配每个字段。 我的示例代码是： 

<fx:Script>
    <![CDATA[
        import mx.controls.Alert;
        import mx.events.FlexEvent;
        import mx.rpc.events.FaultEvent;
        import mx.rpc.events.ResultEvent;
        import mx.utils.ObjectUtil;

        import spark.components.Alert;

        private function xmlListCollectionFilterFun(item:Object):Boolean
        {
            var min:Number = startYear.value;
            var max:Number = endYear.value;
            var exp:Number = item.Experience;
            var bool:Boolean = false;

            if (employeeName.text.length != 0 
                || employeeID.text.length != 0 
                ||designation.text.length != 0
                ||department.text.length != 0
                ||empMobile.text.length != 0
                ||email.text.length != 0
                ||endYear.value != 0
                ||employeeDob.selectedDate
                ||employeeDoj.selectedDate)
            {
                if((item.Name).toLowerCase().indexOf(employeeName.text.toLowerCase())  != -1
                    &&(item.Id).toLowerCase().indexOf(employeeID.text.toLowerCase()) != -1                      
                    && (item.Designation).toLowerCase().indexOf(designation.text.toLowerCase())!= -1
                    && (item.Department).toLowerCase().indexOf(department.text.toLowerCase()) != -1
                    && (item.Mobile).toLowerCase().indexOf(empMobile.text.toLowerCase()) != -1
                    && (item.Email).toLowerCase().indexOf(email.text.toLowerCase()) != -1
                    && (Date.parse(item.DOB)<=employeeDob.selectedDate.time)
                    && (Date.parse(item.DOJ)<=employeeDoj.selectedDate.time)
                    && (min<=exp && exp<=max))
                {
                    bool = true;
                }

            }
            return bool;

        protected function employeeText_changeHandler():void
        {
            if (employeeName.text.length == 0 && department.text.length == 0 && designation.text.length == 0 && 
                empMobile.text.length == 0 && email.text.length == 0 && endYear.value == 0 && startYear.value == 0 &&
                employeeID.text.length == 0 && !employeeDob.selectedDate && !employeeDoj.selectedDate)
            {
                employeeXMLList.filterFunction = null;
            }
            else
            {
                employeeXMLList.filterFunction = xmlListCollectionFilterFun;
            }
            employeeXMLList.refresh();              

        }

        protected function employeeServiceResultHandler(event:ResultEvent):void
        {
            var xmlList:XMLList = XML(event.result).Employee;
            employeeXMLList = new XMLListCollection(xmlList);
        }

        protected function employeeServiceFaultHandler(event:FaultEvent):void
        {
            spark.components.Alert.show(event.fault.faultString,"Fault Information for POST");
        }

        protected function checkStep():void
        {
            if (startYear.value > endYear.value)
            {
                endYear.value = startYear.value+1;
            }
        }
    ]]>
</fx:Script>


<fx:Declarations>   
    <s:XMLListCollection id="employeeXMLList" filterFunction="xmlListCollectionFilterFun"/>
    <s:HTTPService id="employeeService" url="http://localhost/demo/TextXmlFile.xml" 
                   method="POST" result="employeeServiceResultHandler(event)"
                   fault="employeeServiceFaultHandler(event)"
                   resultFormat="xml"/>
</fx:Declarations>

    <s:VGroup width="100%">
        <s:HGroup width="100%">
            <s:TextInput id="employeeName" prompt="Employee Name" change="employeeText_changeHandler()" width="115"/>
            <s:TextInput id="employeeID" prompt="Employee ID" change="employeeText_changeHandler()" width="95"/>
            <mx:DateField id="employeeDob" yearNavigationEnabled="true" editable="false" change="employeeText_changeHandler()"
                          selectableRange="{{rangeStart:new Date(1970, 01, 01), rangeEnd:new Date()}}"
                          selectedDate="{new Date}"/>
            <s:TextInput id="designation" prompt="Designation" change="employeeText_changeHandler()" width="195"/>
            <s:TextInput id="department" prompt="Departmant" change="employeeText_changeHandler()" width="115"/>
            <mx:DateField id="employeeDoj" yearNavigationEnabled="true"  editable="false" change="employeeText_changeHandler()"
                          selectableRange="{{rangeStart:new Date(1970, 01, 01), rangeEnd:new Date()}}"
                          selectedDate="{new Date}"/>
            <s:NumericStepper id="startYear" minimum="0" maximum="50" snapInterval="1" change="checkStep(),employeeText_changeHandler()"/>
            <s:NumericStepper id="endYear" minimum="1" maximum="50" snapInterval="1"
                              change="employeeText_changeHandler()" value="20"/>
            <s:TextInput id="empMobile" prompt="Mobile Number" change="employeeText_changeHandler()" width="170"/>
            <s:TextInput id="email" prompt="Email ID" change="employeeText_changeHandler()" width="310"/>
        </s:HGroup>
        <s:HGroup height="100%" width="100%">
        <s:DataGrid id="dataGrid" dataProvider="{employeeXMLList}" width="100%" height="500">
            <s:columns>
                <s:ArrayCollection>
                    <s:GridColumn id="nameCol" dataField="Name" headerText="Name:" width="120"/>
                    <s:GridColumn id="idCol" dataField="Id" headerText="ID:" width="100"/>
                    <s:GridColumn id="dobCol" dataField="DOB" headerText="DOB:" width="100"/>
                    <s:GridColumn id="designationCol" dataField="Designation" headerText="Designation:" width="200"/>
                    <s:GridColumn id="departmentCol" dataField="Department" headerText="Department:" width="120"/>
                    <s:GridColumn id="dojCol" dataField="DOJ" headerText="DOJ:" width="100"/>
                    <s:GridColumn id="experienceCol" dataField="Experience" headerText="Experience:" width="100"/>
                    <s:GridColumn id="mobileCol" dataField="Mobile" headerText="Mobile:" width="200"/>
                    <s:GridColumn id="emailCol" dataField="Email" headerText="Email:" width="300"/>
                </s:ArrayCollection>
            </s:columns>
        </s:DataGrid>
            </s:HGroup>
    </s:VGroup>

我的问题是：

  1. 我想从DateField中删除selectedDate属性，这意味着当数据加载到DataGrid上时，所有过滤器字段都应该为空。
  2. 我正在使用单个if条件进行过滤。 如何拆分？
  3. 我想过滤数据，即使某些过滤器字段为空。

编辑 

    <fx:Script>
    <![CDATA[
        import mx.controls.Alert;
        import mx.events.FlexEvent;
        import mx.rpc.events.FaultEvent;
        import mx.rpc.events.ResultEvent;
        import mx.utils.ObjectUtil;

        import spark.components.Alert;

        private function xmlListCollectionFilterFun(item:Object):Boolean
        {
            if (employeeName.text.length != 0)
            {
                var xmlName:String = (item.Name).toLowerCase();
                var textName:String = employeeName.text.toLowerCase();
                if((item.Name).toLowerCase().indexOf(employeeName.text.toLowerCase()) != -1)
                {
                    return true;
                }
            }
            if (employeeID.text.length != 0)
            {
                if ((item.Id).toLowerCase().indexOf(employeeID.text.toLowerCase()) != -1)
                {
                    return true;
                } 
            }
            if (employeeDob.selectedDate)
            {
                var dob:String = item.DOB;
                var dobDate:Date = new Date();
                var matches:Array = dob.split("/");
                dobDate.setUTCFullYear(int(matches[0]), int(matches[1]) - 1, int(matches[2]))
                if (ObjectUtil.dateCompare(employeeDob.selectedDate,dobDate) == -1)
                {
                    return true;        
                }
            } 
            if (designation.text.length != 0)
            {
                if ((item.Designation).toLowerCase().indexOf(designation.text.toLowerCase())!= -1)
                {
                    return true;
                }
            }
            if (department.text.length != 0)
            {
                if ((item.Department).toLowerCase().indexOf(department.text.toLowerCase()) != -1)
                {
                    return true;
                }
            }
            if (employeeDoj.selectedDate)
            {
                var doj:String = item.DOJ;
                var dojDate:Date = new Date();
                var matche:Array = doj.split("/");
                dojDate.setUTCFullYear(int(matche[0]), int(matche[1]) - 1, int(matche[2]))
                if (ObjectUtil.dateCompare(employeeDoj.selectedDate,dojDate) == -1)
                {
                    return true;        
                }
            } 
            if (endYear.value != 0)
            {
                var min:Number = startYear.value;
                var max:Number = endYear.value;
                var exp:Number = item.Experience;
                if ((min<=exp) && (exp<=max))
                {
                    return true;
                }
            } 
            if (empMobile.text.length != 0)
            {
                if ((item.Mobile).toLowerCase().indexOf(empMobile.text.toLowerCase()) != -1)
                {
                    return true;
                }
            } 
            if (email.text.length != 0)
            {
                if ((item.Email).toLowerCase().indexOf(email.text.toLowerCase()) != -1)
                {
                    return true;
                }
            }

            return false;
        }

        protected function employeeText_changeHandler():void
        {
            if (employeeName.text.length == 0 && department.text.length == 0 && designation.text.length == 0 && 
                empMobile.text.length == 0 && email.text.length == 0 && endYear.value == 0 && startYear.value == 0 &&
                employeeID.text.length == 0 && !employeeDob.selectedDate && !employeeDoj.selectedDate)
            {
                employeeXMLList.filterFunction = null;
            }
            else
            {
                employeeXMLList.filterFunction = xmlListCollectionFilterFun;
            }
            employeeXMLList.refresh();              

        }

        protected function employeeService_resultHandler(event:ResultEvent):void
        {
            var xmlList:XMLList = XML(event.result).Employee;
            employeeXMLList = new XMLListCollection(xmlList);
        }

        protected function employeeService_faultHandler(event:FaultEvent):void
        {
            spark.components.Alert.show(event.fault.faultString,"Fault Information for POST");
        }

    ]]>
</fx:Script>


<fx:Declarations>   
    <s:XMLListCollection id="employeeXMLList" filterFunction="xmlListCollectionFilterFun"/>
    <s:HTTPService id="employeeService" url="http://localhost/demo/TextXmlFile.xml" 
                   method="POST" result="employeeService_resultHandler(event)"
                   fault="employeeService_faultHandler(event)"
                   resultFormat="xml"/>
</fx:Declarations>

<s:layout>
    <s:VerticalLayout verticalAlign="top" horizontalAlign="center" paddingTop="30"/>
</s:layout>
<mx:VBox width="100%">
    <s:HGroup horizontalAlign="center" verticalAlign="middle">
        <s:Label id="mainLabel" text="Employee Details"/>
    </s:HGroup>
    <s:HGroup width="100%">
        <s:TextInput id="employeeName" prompt="Employee Name" change="employeeText_changeHandler()" width="115"/>
        <s:TextInput id="employeeID" prompt="Employee ID" change="employeeText_changeHandler()" width="95"/>
        <mx:DateField id="employeeDob" yearNavigationEnabled="true" editable="true" change="employeeText_changeHandler()"
                      selectableRange="{{rangeStart:new Date(1970, 01, 01), rangeEnd:new Date()}}"/>
        <s:TextInput id="designation" prompt="Designation" change="employeeText_changeHandler()" width="195"/>
        <s:TextInput id="department" prompt="Departmant" change="employeeText_changeHandler()" width="115"/>
        <mx:DateField id="employeeDoj" yearNavigationEnabled="true"  editable="true" change="employeeText_changeHandler()"
                      selectableRange="{{rangeStart:new Date(1970, 01, 01), rangeEnd:new Date()}}"/>
        <s:NumericStepper id="startYear" minimum="0" maximum="50" snapInterval="1" change="employeeText_changeHandler()"/>
        <s:NumericStepper id="endYear" minimum="0" maximum="50" snapInterval="1" change="employeeText_changeHandler()"/>
        <s:TextInput id="empMobile" prompt="Mobile Number" change="employeeText_changeHandler()" width="170"/>
        <s:TextInput id="email" prompt="Email ID" change="employeeText_changeHandler()" width="310"/>
    </s:HGroup>
    <s:DataGrid id="dataGrid" dataProvider="{employeeXMLList}" width="100%" height="100%">
        <s:columns>
            <s:ArrayCollection>
                <s:GridColumn id="nameCol" dataField="Name" headerText="Name:" width="120"/>
                <s:GridColumn id="idCol" dataField="Id" headerText="ID:" width="100"/>
                <s:GridColumn id="dobCol" dataField="DOB" headerText="DOB:" width="100"/>
                <s:GridColumn id="designationCol" dataField="Designation" headerText="Designation:" width="200"/>
                <s:GridColumn id="departmentCol" dataField="Department" headerText="Department:" width="120"/>
                <s:GridColumn id="dojCol" dataField="DOJ" headerText="DOJ:" width="100"/>
                <s:GridColumn id="experienceCol" dataField="Experience" headerText="Experience:" width="100"/>
                <s:GridColumn id="mobileCol" dataField="Mobile" headerText="Mobile:" width="200"/>
                <s:GridColumn id="emailCol" dataField="Email" headerText="Email:" width="300"/>
            </s:ArrayCollection>
        </s:columns>
    </s:DataGrid>
</mx:VBox>

在这里，我做了一切。 但是过滤器的性能类似于employeeName.Text || employeeId.text || .....但是我需要像employeeName.Text && employeeId.text && .....这样的过滤器

我当前的输出是： 在此处输入图片说明

但是我想要这样： 在此处输入图片说明

更新资料 

                var bool:Boolean = true;
            if (employeeName.text.length != 0)
            {
                if((item.Name).toLowerCase().indexOf(employeeName.text.toLowerCase()) != -1) 

                {
                    bool = bool && true;
                }
                else
                {
                    bool = bool && false;
                }
            }

可能正确。

1 个解决方案

解决方案1
 0  2014-03-05 09:12:47

关于吐它，您可以为每个列创建一个小的过滤器功能并将其组合 

function nameFilter
function emailFilter

function collectionFilter(iterm:*):Boolean{
 return nameFilter(item)&&emailFilter(item)&&....
}

使用这种方法，您可以一个一个地实现它们并测试过滤。

如果过滤器字段为空，则只需从过滤器返回true 

function nameFilter(item:*):Boolean{
 var name:String=item.name;
 var filter:String=employeeName.text;
 if(!filter||filter.length==0) return true;
 return name.indexOf(filter)==0;//change this to get your results
//you may want to make the name and filter lowercase before this
}

因此，我们的想法是将大型函数拆分为较小的函数，一个函数应该做一件事情并且很简单，如果可能的话，我还尝试使它们没有副作用（计算并返回结果，而不更改任何字段）。 您有时可能会忽略此规则，但这具有很多优点，尤其是易于阅读和推理的事实。

编辑这是错误的 

    if (empMobile.text.length != 0)
    {
        if ((item.Mobile).toLowerCase().indexOf(empMobile.text.toLowerCase()) != -1)
        {
            return true;
        }
    }

因为该代码将无法通过其他检查，所以这是一个您将出错的地方，您可以通过取反并返回false来实现，因为如果您希望AND（所有过滤器都必须通过），那么当您找到时可以返回false第一个失败的过滤器

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 在flex4中检查空的XML，XMLList或XMLListCollection Facebook 使用flex4登录 Flex 3中的XML和XMLList以及XMLListCollection 如何使用Flex4浏览服务器文件 如何使用flex4使用前置摄像头 Flex：将元素添加到XMLListCollection吗？ Flex XMLListCollection对嵌套标签进行排序 flex4 LinkElement下划线 使用Flex4 SDK进行编译 使用Flex4和操作脚本3将图像添加到TextInput中
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM