FilterFields Doc

[esatkavgaoglu]

Hi;

I couldn't find any example of using filterFields. I am trying to filter local data list in redux grid. Could you please direct me to the example or and documentation about filterFields? I am in a desperate situation!

[bencripps]

@Vanderslice you got any tips?

[Vanderslice]

Hey, sorry, didn't see a message for this for some reason. I haven't worked with local filtering too much. My original use case for filterFields was really more for passing a filterFields object through that can be consumed by your datasource function for remote sort so you're not required to bind something like that. I think my assumption was that if you are using local data and filtering you would handle the filtering of the data array and setting the new data at the time of the search.

I could see an argument for building out local search and maybe adding configurable search at some point in the future.

[qingmulanyun]

Any tips or more details about how to use filterFields ?

[raamkumaarb]

@bencripps @Vanderslice I didn't see any Search option in this package. One of the major requirement in Grid functionality. Do we have Search? How can I enable that? I can see filterFields props. Is it related to Search? If yes, Any update on how to use it(Sample piece of code).

[qingmulanyun]

@raamkumaarb I found a workaround for my own situation. Hope it's helpful for you. I use datasource to grad server data. So I stored the search keywords as a state in Store and consume it in my datasource function.(Redux store is actually a javascript object. You can consume it wherever you want.)

import store from '../../../redux/configureStore';

export const dataSource = function getData({ pageIndex, pageSize }) { var newState =store.getState();

const searchingFilter = newState.app.searchingFilter; return new Promise((resolve) => { const request = new XMLHttpRequest();

    const config = {
        method: 'GET',
        route: '#your_route'
    };
    if (pageIndex !== undefined) {
        config.route = `${config.route}page=${pageIndex + 1}&page_size=${pageSize}&key_word=${searchingFilter}`;
    }

    request.open(config.method, config.route, true);

    request.addEventListener(
        'load', (res) => {
            const response = JSON.parse(res.target.responseText);

            // if you have more data than is being shown
            // ensure you return a total, so the pager knows
            // what paging actions are possible

            resolve({
                data: response,
                total: response.length > 0 ? response[0].total : 0
            });
        }
    );

    request.send(config.data || null);
});

};

[GerJeffrey]

I has encountered the same problem.I find some action constants about filter in ActionTypes.js ,for example: var SET_FILTER_VALUE = exports.SET_FILTER_VALUE = '@@react-redux-grid/SET_FILTER_VALUE'; var FILTER_DATA = exports.FILTER_DATA = '@@react-redux-grid/FILTER_DATA'; var CLEAR_FILTER_LOCAL = exports.CLEAR_FILTER_LOCAL = '@@react-redux-grid/CLEAR_FILTER_LOCAL'; var CLEAR_FILTER_REMOTE = exports.CLEAR_FILTER_REMOTE = '@@react-redux-grid/CLEAR_FILTER_REMOTE'; var SHOW_FILTER_MENU = exports.SHOW_FILTER_MENU = '@@react-redux-grid/SHOW_FILTER_MENU'; var SET_FILTER_MENU_VALUES = exports.SET_FILTER_MENU_VALUES = '@@react-redux-grid/SET_FILTER_MENU_VALUES';

but I don't find out the actions and reducers to implements these actions and I don't find the state where the filter object or function to be hold yet. Mybe, @bencripps bencripps has a plan to complete it, but now ,it's not available to use.

[raamkumaarb]

@qingmulanyun Thanks a lot for your response. Let me try this way. :-)

[bencripps]

The filter constants were previously used when the Grid implemented a filter bar -- this has since been removed :(

I think the current expectation is that users manage their own filter states (i.e. build a component with actions) that triggers a filtering of the data that gets passed into the grid.

[bencripps]

I've removed all usages of the filter constants (there wasn't much since that feature was deleted a long time ago).