JavaScript/jQuery TreeList - Server-Side Data Processing
We recommend server-side data processing for large datasets. The ODataStore supports server-side filtering and sorting. DevExtreme provides extensions that help implement data processing for ASP.NET and PHP servers. You can also use the third-party extension for MongoDB. If these extensions do not suit your data source, implement server-side data processing manually according to the protocol described in the Custom Sources article.
Specify the remoteOperations property to notify the TreeList of the server's data processing operations.
jQuery
JavaScript
$(function() {
$("#treeListContainer").dxTreeList({
// ...
remoteOperations: {
filtering: true,
sorting: true,
grouping: true
}
});
}); Angular
HTML
TypeScript
<dx-tree-list ... >
<dxo-remote-operations
[filtering]="true"
[sorting]="true"
[grouping]="true">
</dxo-remote-operations>
</dx-tree-list>
import { DxTreeListModule } from "devextreme-angular";
// ...
export class AppComponent {
// ...
}
@NgModule({
imports: [
// ...
DxTreeListModule
],
// ...
})Vue
App.vue
<template>
<DxTreeList ... >
<DxRemoteOperations
:filtering="true"
:sorting="true"
:grouping="true"
/>
</DxTreeList>
</template>
<script>
import 'devextreme/dist/css/dx.light.css';
import DxTreeList, {
DxRemoteOperations
} from 'devextreme-vue/tree-list';
export default {
components: {
DxTreeList,
DxRemoteOperations
},
// ...
}
</script>React
App.js
import React from 'react';
import 'devextreme/dist/css/dx.light.css';
import TreeList, {
RemoteOperations
} from 'devextreme-react/tree-list';
export default function App() {
return (
<TreeList ... >
<RemoteOperations
filtering={true}
sorting={true}
grouping={true}
/>
</TreeList>
);
}Feedback