[mrkhanakiaParticipant]

Hi Ivo,

Your solution worked but partially. Sometimes when my component updates multiple time then it removes all the Column Header Titles.

So is there any other way to find out how many parentelements exists if there is only One parementelement then do not remove.

[mrkhanakiaParticipant]

Thanks i will try

[mrkhanakiaParticipant]

Have you checked the issue yet ?

[mrkhanakiaParticipant]

Hi Ivo,

Any update on the issue ?

[mrkhanakiaParticipant]

Hi Ivo,

Your solution worked only if I pass some default Items with Props if I pass empty props then it does not works.
Check this link please https://www.jseditor.io/?key=jqxgrid-header

Regards,
Aman

[mrkhanakiaParticipant]

Any update ?

[mrkhanakiaParticipant]

Hi Ivo,

Check now i shared it to everyone https://www.jseditor.io/?key=new-document-1-2-3-4-5-6-7-8-9

[mrkhanakiaParticipant]

Hi,

Any update on this. I also created an live working example of issue check here

https://www.jseditor.io/?key=new-document-1-2-3-4-5-6-7-8-9

Please help me to solve the issue it’s very urgent. My whole application is using Jqwidgets.

Regards,

[mrkhanakiaParticipant]

Hi Ivo,

Issue is occurring when using databind method on componentDidUpdate check below code I just modified the example you provided.

import React, { Component } from "react";

import JqxGrid from '../jqwidgets-react/react_jqxgrid.js';
import { jqx } from '../jqwidgets-react/react_jqxgrid.js';

class App extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            count : 0
        }
    }

    static defaultProps = {
        entriesList: [
            { '_id': 1, 'account_name': 'AAA', 'limit': 1, 'status': true, 'hide': false },
            { '_id': 2, 'account_name': 'AAA', 'limit': 1, 'status': true, 'hide': false },
            { '_id': 3, 'account_name': 'AAA', 'limit': 1, 'status': true, 'hide': false }
        ],
        entriesList1: [
            { '_id': 4, 'account_name': 'BBB', 'limit': 1, 'status': true, 'hide': false },
            { '_id': 5, 'account_name': 'BBB', 'limit': 1, 'status': true, 'hide': false },
            { '_id': 6, 'account_name': 'BBB', 'limit': 1, 'status': true, 'hide': false }
        ],
        onDataUpdate: function () { },
        editItem: function (account_id) { }
    }

    componentWillMount() {
        this.initDataAdapter()
    }

    componentDidMount() {
        this.setState({
            count: 1
        })
    }

    componentDidUpdate() {
        this.source.localdata = this.props.entriesList1;
        this.dataAdapter.dataBind();
    }

    initDataAdapter() {
        var datafields = [
            { name: '_id', type: 'string' },
            { name: 'account_name', type: 'string' },
            { name: 'limit', type: 'number' },
            { name: 'status', type: 'boolean' },
            { name: 'hide', type: 'boolean' },
        ];

        this.source = {
            datatype: 'json',
            datafields: datafields,

            id: '_id',
            localdata: this.props.entriesList
        };

        this.dataAdapter = new jqx.dataAdapter(this.source);

        this.columns = [
            { text: 'Id', datafield: '_id', width: 50 },
            { text: 'Name', datafield: 'account_name', width: 230 },
            { text: 'Limit', datafield: 'limit', width: 100 },
            { text: 'Status', datafield: 'status', width: 50, columntype: 'checkbox' },
            { text: 'Hide', datafield: 'hide', width: 50, columntype: 'checkbox' },
        ];
    }

    render() {
        return (
            <div>
                <JqxGrid
                    source={this.dataAdapter} columns={this.columns}
                    width={"100%"} height={400} pageable={true} pagermode={'simple'} pagesize={1000}
                    sortable={true} altrows={false} enabletooltips={true}
                    editable={false}
                    filterable={true} showfilterrow={true}
                />
            </div>
        );
    }
}

export default App;

[mrkhanakiaParticipant]

The issue occurs when i try to databind in order load the updated data this.dataAdapter.dataBind()

[mrkhanakiaParticipant]

The picture matches the settings this is the issue I am talking about it shows double headers instead of Filter Row. When page loads.

Check Video link i created https://screencast.com/t/bfmNXgo3o7a

[mrkhanakiaParticipant]

Yes it works now thanks

[mrkhanakiaParticipant]

Hi Peter,
Can you provide me an example please How to Modify Filter Parameters before sending it to server side.

[Author]

Posts