<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:grids="com.flexicious.grids.*"
xmlns:columns="com.flexicious.grids.columns.*" xmlns:mate="http://mate.asfusion.com/" width="100%" creationComplete="onCreationComplete()"
xmlns:flxs="com.flexicious.nestedtreedatagrid.*">
<mx:RemoteObject id="dotNetRemoteObject" showBusyCursor="true" destination="fluorine" source="Site.Services.FlexService">
<mx:method name="getEmployees" result="onEmployeesResult(event)"/>
<mx:method name="getAllDepartments" result="onDepartmentsResult(event)"/>
</mx:RemoteObject>
<mx:Script>
<![CDATA[
import com.flexicious.controls.MultiSelectComboBox;
import com.flexicious.controls.Spinner;
import com.flexicious.example.model.classic.Employee;
import com.flexicious.example.model.classic.EmployeeGenerator;
import com.flexicious.example.model.classic.MyFilter;
import com.flexicious.example.model.classic.MyPrintExportFilter;
import com.flexicious.example.utils.ExampleUtils;
import com.flexicious.export.ExportController;
import com.flexicious.grids.dependencies.IDataGridFilter;
import com.flexicious.grids.dependencies.IDataGridFilterColumn;
import com.flexicious.grids.events.FilterPageSortChangeEvent;
import com.flexicious.grids.events.PrintExportDataRequestEvent;
import com.flexicious.grids.filters.Filter;
import com.flexicious.grids.filters.FilterExpression;
import com.flexicious.grids.filters.PrintExportFilter;
import com.flexicious.nestedtreedatagrid.events.ExtendedFilterPageSortChangeEvent;
import com.flexicious.print.PrintController;
import com.flexicious.utils.DateRange;
import com.flexicious.utils.UIUtils;
import mx.collections.ArrayCollection;
import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
import mx.rpc.events.ResultEvent;
[Bindable(private var _serverDepartments:ArrayCollection;
[Bindable(private var _totalRecords:int;
private function onCreationComplete():void
{
var filter:MyFilter=new MyFilter(null);
filter.pageIndex=0;
filter.pageSize=dgEmployeesServer.pageSize;
dotNetRemoteObject.getAllDepartments();
dotNetRemoteObject.getEmployees(filter);
}
private var filterTriggerColumn:String="";
private function onFilterPageSortChange(event:ExtendedFilterPageSortChangeEvent):void
{
dotNetRemoteObject.getEmployees(new MyFilter(event.filter));
if(event.triggerEvent&&event.triggerEvent.currentTarget is IDataGridFilterColumn)
filterTriggerColumn=event.triggerEvent.currentTarget.searchField;
}
private function onPrintExportDataRequest(event:PrintExportDataRequestEvent):void
{
dotNetRemoteObject.getEmployees(new MyPrintExportFilter(event.filter as PrintExportFilter));
}
private function onEmployeesResult(event:ResultEvent):void
{
if (event.result.isPrintExportResponse)
{
dgEmployeesServer.printExportData=event.result.records;
}
else
{
dgEmployeesServer.totalRecords=event.result.totalRecords;
dgEmployeesServer.dataProvider=event.result.records as ArrayCollection;
_totalRecords=event.result.totalRecords;
dgEmployeesServer.rebuildFooter();
if(filterTriggerColumn){
dgEmployeesServer.validateNow();
dgEmployeesServer.setFilterFocus(filterTriggerColumn);
filterTriggerColumn="";
}
}
}
public function myStyleFunc(data:Object, col:AdvancedDataGridColumn):Object
{
if (data["annualSalary"] > 75000)
return {color:0xFF0000};
return null;
}
private function onDepartmentsResult(event:ResultEvent):void
{
_serverDepartments=event.result as ArrayCollection;
dgEmployeesServer.refreshLayout();
}
]]>
</mx:Script>
<mx:HBox width="100%">
<mx:Label text="# Selected Ids: {dgEmployeesServer.selectedKeys.length}"/>
<mx:Spacer width="100%"/>
<mx:Button label="View Explanation For Example" click="UIUtils.openBrowserPopup('http://www.flexicious.com/Home/AdvancedFlexDataGridPagingFilterServer',
'width=1024,height=768,lef t=0,top=0, toolbar=No,location=No,scrollbars=Yes,status=No,resizable=No,fullscreen=No')"/>
</mx:HBox>
<mx:TextArea width="100%" text="This example shows a ADVANCED Data Grid bound to a .NET implementation. The C# demonsrates the construction of Entity HQL on basis of the Flexicious filter. This grid also demonstrates how to handle the scenario when the user requests a print/export of data currently not loaded. (See onPrintExportDataRequest). It also shows how to use a Custom Pager Control."/>
<flxs:FlexDataGrid showSpinnerOnFilterPageSort="true" enableFilters="true" enableCopy="true" enableFooters="true"
enablePreferencePersistence="true" preferencePersistenceKey="serverGridDotNet"
enablePaging="true" id="dgEmployeesServer" height="271"
pageSize="20" filterPageSortMode="server"
enablePrint="true" enableExport="true"
clearSelectionOnDataProviderChange="false"
enableSplitHeader="true" enableMultiColumnSort="true"
enableEagerDraw="true"
initialSortField="firstName"
filterPageSortChange="onFilterPageSortChange(event)" width="100%"
filterRowHeight="30"
printExportDataRequest="onPrintExportDataRequest(event)" selectedKeyField="employeeId">
<flxs:groupedColumns>
<flxs:FlexDataGridCheckBoxColumn width="15"/>
<flxs:FlexDataGridColumn headerText="ID" dataField="employeeId" filterControl="NumericTextInput" filterTriggerEvent="enterKeyUp"/>
<flxs:FlexDataGridColumnGroup headerText="Name">
<flxs:columns>
<flxs:FlexDataGridColumn headerText="First Name" dataField="firstName" filterOperation="BeginsWith" filterControl="TextInput" filterTriggerEvent="enterKeyUp"/>
<flxs:FlexDataGridColumn headerText="Last Name" dataField="lastName" filterOperation="BeginsWith" filterControl="TextInput" filterTriggerEvent="enterKeyUp"/>
</flxs:columns>
</flxs:FlexDataGridColumnGroup>
<flxs:FlexDataGridColumn
headerText="Department" dataField="department" filterOperation="Equals"
searchField="department.departmentId" sortField="department.departmentName"
filterComboBoxDataProvider="{_serverDepartments}"
filterComboBoxDataField="departmentId"
filterComboBoxLabelField="departmentName"
filterControl="MultiSelectComboBox"
filterComboBoxWidth="150"
/>
<flxs:FlexDataGridColumn headerText="Phone" dataField="phoneNumber" filterOperation="Contains" filterControl="TextInput"/>
<flxs:FlexDataGridColumn headerText="Active" dataField="isActive" filterOperation="Equals" filterControl="TriStateCheckBox"/>
<flxs:FlexDataGridColumn headerText="Hire Date" dataField="hireDate" filterControl="DateComboBox" labelFunction="UIUtils.dataGridFormatDateLabelFunction"
filterDateRangeOptions="{[DateRange.DATE_RANGE_THISQUARTER,DateRange.DATE_RANGE_LASTQUARTER,DateRange.DATE_RANGE_THISYEAR,DateRange.DATE_RANGE_LASTYEAR,DateRange.DATE_RANGE_CUSTOM]}"
filterComboBoxWidth="150" footerLabel="Count: {_totalRecords}"/>
<flxs:FlexDataGridColumn textAlign="right" footerFormatter="{ExampleUtils.globalCurrencyFormatter}" labelFunction="UIUtils.dataGridFormatCurrencyLabelFunction"
width="100" headerText="Annual Salary"
dataField="annualSalary" footerOperation="average" footerLabel="Avg:"
filterControl="NumericRangeBox"/>
</flxs:groupedColumns>
</flxs:FlexDataGrid>
</mx:VBox>