用于在按钮单击时过滤gridview记录的Javascript代码

时间:2015-07-06 13:32:32

标签: javascript asp.net

我有一个与数据绑定的gridview。我想过滤按钮点击的记录,它将从文本框中获取一些输入,点击按钮它将过滤记录,并显示哪些记录与输入匹配。

1 个答案:

答案 0 :(得分:0)

我认为这会对你有所帮助......

ASPX设计:

<script type="text/javascript">

    function Filter() {
        var txtKeyword = document.getElementById('<%= txtKeyword.ClientID %>');        
        var tblGrid = document.getElementById('<%= gvDemo.ClientID %>');        
        var rows = tblGrid.rows;
        var i = 0, row, cell ;
        for (i = 1; i < rows.length; i++) {
            row = rows[i];
            var found = false;
            for (var j = 0; j < row.cells.length; j++) {
                cell = row.cells[j];
                if (cell.innerHTML.toUpperCase().indexOf(txtKeyword.value.toUpperCase()) >= 0) {
                    found = true;
                    break;
                }
            }
            if (!found) {
                row.style['display'] = 'none';

            }
            else {
                row.style.display = '';
            }
        }

        return false;
    }

</script>

JavaScript代码:

&#13;
&#13;
protected void Page_Load(object sender, EventArgs e)
{

}
protected void btnPopulate_Click(object sender, EventArgs e)
{
    DataTable dtEmployee = PopulateDataTable();
    gvDemo.DataSource = dtEmployee;
    gvDemo.DataBind();
}
protected DataTable PopulateDataTable()
{ 
    //here is logic to populate your data table
    //I'm using dummy data
    DataTable dt = new DataTable();
    dt.Columns.Add(new DataColumn("FirstName", typeof(string)));
    dt.Columns.Add(new DataColumn("LastName", typeof(string)));

    dt.Rows.Add(dt.NewRow());
    dt.Rows.Add(dt.NewRow());
    dt.Rows.Add(dt.NewRow());
    dt.Rows.Add(dt.NewRow());
    dt.Rows.Add(dt.NewRow());
    dt.Rows.Add(dt.NewRow());
    dt.Rows.Add(dt.NewRow());
    dt.Rows.Add(dt.NewRow());

    dt.Rows[0]["FirstName"] = "Sangram";
    dt.Rows[0]["LastName"] = "Patil";

    dt.Rows[1]["FirstName"] = "Prasad";
    dt.Rows[1]["LastName"] = "Patil";

    dt.Rows[2]["FirstName"] = "Girish";
    dt.Rows[2]["LastName"] = "Mane";

    dt.Rows[3]["FirstName"] = "Kedar";
    dt.Rows[3]["LastName"] = "Torase";

    dt.Rows[4]["FirstName"] = "Nandu";
    dt.Rows[4]["LastName"] = "Desai";

    dt.Rows[5]["FirstName"] = "Promod";
    dt.Rows[5]["LastName"] = "Mandavkar";

    dt.Rows[6]["FirstName"] = "Kiran";
    dt.Rows[6]["LastName"] = "More";

    dt.Rows[7]["FirstName"] = "Vaibhav";
    dt.Rows[7]["LastName"] = "Telang";

    return dt;
}
&#13;
&#13;
&#13;

C#代码:

sudo chmod 644 /Applications/XAMPP/xamppfiles/htdocs/