Skip to main content

This package provides easy integration between Django REST framework and DevExtreme Data Grid. It handles grouping, paging, filtering, aggregating and ordering on serverside.

Project description

drf-dx-datagrid

Overview

This package provides easy integration between Django REST framework and DevExtreme Data Grid. It handles grouping, paging, filtering, aggregating and ordering on serverside.

In which case should you use drf-dx-datagrid?

You have DevExtreme in the frontend and Django REST framework as the backend. And your data is too large to load at once, but you want use grouping and filtering.

How it works?

Drf-dx-datagrid supports devextreme load options in HTTP-request and returns data in format fully compatible with Data Grid. All you need is to replace classname "ModelViewSet" with "DxModelViewSet" in your django project. #Installation pip install drf-dx-datagrid

Configuration

Define your ViewSet classes:

from drf_dx_datagrid import DxModelViewSet

class MyModelViewSet(DxModelViewSet):
    serializer_class = MyModelSerializer
    queryset = core.models.MyModel.objects.all()

Example for React.js:

const load = (loadOptions) => {
    return axios(`${my_url}`, {
            params: loadOptions
        }
    ).then((response) => response.data
    )
}

export default class Example extends PureComponent {
   state={
       store: new CustomStore({ load: load})
   }

    render() {
        return (<DataGrid
                    dataSource={this.state.store}
                    height={"100vh"}
                >
                    <RemoteOperations groupPaging={true}/>
                    <Scrolling mode={'virtual'}/>
                    <HeaderFilter visible={true} allowSearch={true}/>
                    <Paging defaultPageSize={40}/>
                    <Sorting mode={"multiple"}/>
                    <FilterRow visible={true}/>
                    <GroupPanel visible={true}/>
                    <Grouping autoExpandAll={false}/>
                    <Summary>
                        <TotalItem column={"id"} summaryType={"count"}/>
                        <GroupItem column={"name"} summaryType={"max"}/>
                    </Summary>
                </DataGrid>
        );
    }
}

Example for jQuery.js:

        const load = (loadOptions) => {
            return axios(`${my_url}`, {
                    params: loadOptions
                }
            ).then((response) => response.data
            )
        }

        const store = new DevExpress.data.CustomStore({load: load});
        $("#gridContainer").dxDataGrid({
            dataSource: store,
            height: "100vh",
            remoteOperations: {
                groupPaging: true
            },
            scrolling: {mode: 'virtual'},
            headerFilter: {visible: true, allowSearch: true},
            paging: {defaultPageSize: 40},
            sorting: {mode: "multiple"},
            filterRow: {visible: true},
            groupPanel: {visible: true},
            grouping: {autoExpandAll: false},
            summary: {
                totalItems: [{
                    column: "id",
                    summaryType: "count"
                }],
                groupItems: [{
                    column: "id",
                    summaryType: "min"
                }]
            }
        });

By default, filtering is case-sensitive.If you want case-insensitive behavior, you must set FILTER_CASE_SENSITIVE parameter to false in django settings:

REST_FRAMEWORK = {
    'DRF_DX_DATAGRID': {
        'FILTER_CASE_SENSITIVE': False}
}

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

drf_dx_datagrid-0.4.2.tar.gz (6.1 kB view details)

Uploaded Source

File details

Details for the file drf_dx_datagrid-0.4.2.tar.gz.

File metadata

  • Download URL: drf_dx_datagrid-0.4.2.tar.gz
  • Upload date:
  • Size: 6.1 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/3.1.1 pkginfo/1.5.0.1 requests/2.22.0 setuptools/45.1.0 requests-toolbelt/0.9.1 tqdm/4.42.1 CPython/3.6.9

File hashes

Hashes for drf_dx_datagrid-0.4.2.tar.gz
Algorithm Hash digest
SHA256 682490f8f189e9cb069dad25b9b6a9df42926aeeb9a2023c59b1e815335d2bc3
MD5 fb8902ade012e76efce1b09b3cbc5a0a
BLAKE2b-256 95ab07d14d2304f3eb4cbb7b84f38f796a28004f16470f16ad64ecb76d7cbd46

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page