aspx GridView filter with javascript

Question

I'm using Asp.net with c# code, VS 2010. I have a page with a gridview which shows a members list. I would like to use javascript without any ajax to filter the rows in the grid as the user type. For example if the user typed "Jo" then the rows with "John" and "Jonny" will stay and the other ones will be filtered out.

Thanks.

Answer 1

Here's a working example of what you need

function SetupFilter(textboxID, gridID, columnName) {
    $('#' + textboxID).keyup(function () {
        var index;
        var text = $("#" + textboxID).val();

        $('#' + gridID + ' tbody tr').each(function () {
            $(this).children('th').each(function () {
                if ($(this).html() == columnName)
                    index = $(this).index();
            });

            $(this).children('td').each(function () {
                if ($(this).index() == index) {
                    var tdText = $(this).children(0).html() == null ? $(this).html() : $(this).children(0).html();

                    if (tdText.indexOf(text, 0) > -1) {
                        $(this).closest('tr').show();
                    } else {
                        $(this).closest('tr').hide();
                    }
                };
            });
        });
    });
};

Then all you need to do, after you include the above code segment in your page head or startup .js file is to call the below for each textbox you want to actively filter your grid:

$(function () { SetupFilter("myTextBox", "myGridView", "My Column Name"); });

Answer 2

For sure JQuery will be your friend in this case. www.jquery.com Try out some tutorials for the general usage. Then in the Init Script reference the Object, directly search for all TD's with these letters in and add ".each().remove(this);"

Should work, otherwise please paste a little bit more code.

LG Jonas Plitt