Skip to content

Question: How do you filter by columns? #241

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
neo22s opened this issue Nov 10, 2015 · 5 comments · May be fixed by #280
Open

Question: How do you filter by columns? #241

neo22s opened this issue Nov 10, 2015 · 5 comments · May be fixed by #280

Comments

@neo22s
Copy link

neo22s commented Nov 10, 2015

Hello,

Great job on this software. I know you do not have filter by columns and I am thinking in different work arounds.

Anyone has done it? any feedback or help appreciated.

thanks.

@TobiasXy
Copy link

TobiasXy commented Dec 1, 2015

For my tables with enabled ajax I did it like this (this does not work for client-side only tables):

Create your own search form with the search fields you want to have.

Add these custom search values to your ajax requests like this:

$('#grid').bootgrid({
    ajax : true,
    url : '/this/is/the/ajax/url',
    otherStuff : ... ,
    requestHandler : function (request) {
        request.searchVal1 = $('#search-field-1').val();
        request.searchVal2 = $('#search-field-2').val();
        return request;
    }
});

This would send the search values on every ajax request and you can use it on the server to filter the rows.

Probably you want to filter the rows as soon as you change one of the custom search fields. I did it like this:

// we only want to trigger the reload 0.5 seconds after the last input event
// so we use this variable to have a reference to the timeout
// then we can clear the timeout if we get another input within the 0.5 seconds
var searchTimeout = null;
$('#search-form').find('input, select').on('input', function () {
    clearTimeout(searchTimeout);
    searchTimeout = setTimeout(function () {
        // just reload the bootgrid.
        // Search values will be appended by the requestHandler defined above
        $('#grid').bootgrid('reload');
    }, 500);
});

As mentioned above this approach only works for ajax-enabled tables.

@neo22s
Copy link
Author

neo22s commented Dec 1, 2015

Thats a good idea! at then I did it really differently not using the ajax request.....but filtering the parameters by get....nasty.

how did you add the filter values (selects/inputs) to the search form so gets properly integrated?

@TobiasXy
Copy link

TobiasXy commented Dec 1, 2015

Actually I just disabled the built-in search field and added my search form outside of the bootgrid.

To add it to the actual bootgrid, you can probably use the templates.header or templates.search for it: http://www.jquery-bootgrid.com/Documentation#templates
I did not try it myself, but I think it should work like this.

@neo22s
Copy link
Author

neo22s commented Dec 1, 2015

thanks a lot I will take a look ;)

@EdwardsNick
Copy link

See pull request #280

@EdwardsNick EdwardsNick linked a pull request Mar 21, 2016 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants