aspx GridView filter with javascript

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开发者_JAVA百科 ones will be filtered out.

Thanks.

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

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"); });