Sunday, April 3, 2011

search panel inside the grid

I have to add textbox on top row inside the grid. and when end user insert the search value than grid result should be populated accordingly.

But how i can add text box only on top row. CSS of grid does not allow me to add text boxes on header. my grid should look like this

Header: Emp# EmpName EmpAddd
Search TextBox : [_____] [_____] [______]
Lable show data : 1 aaa adress1
Lable show data : 2 bbb adress2
Lable show data : 3 ccc adress3

Search is not my problem but how i can add text box only for top row in grid view. I can not add always text box and give the look n feel of other text box as label.



SOLUTION:


1) READ THE  html markup of grid. 
create same row and add search textboxes in the td on document.ready function


2)Attach search function on change event for the all search textboxes call it function FilterGrid.


3) on FilterGrid set the value of search textboxes in hidden field.

4) call clcik event on filterGrid function and now on C# code behind get the values from hidden fields and filter the gird datasoruce.

5)when page again render than search panel will set again on document.ready function.

5A) if you are using update panel than call same function on update panels event's refresh or load funtion.


Also can add search panel in gridview in server side (C#):



 protected void GVtest_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        { 
            //Create the Row
            GridViewRow row = new GridViewRow(-1, -1, DataControlRowType.DataRow, DataControlRowState.Normal);
            //Add the two Columns
            if(e.Row.RowIndex == 1)
            row.Cells.AddRange(CreateSarchPanel());
            //get a reference to the table that holds this row
            Table gridviweTable = (e.Row.Parent as Table);
            //Add the row at 0 indx.
            gridviweTable.Rows.AddAt(0, row);
       }
           
        }
    private TableCell[] CreateSarchPanel()
    {


        TableCell[] cells = new TableCell[2];
        TableCell cell;
        TextBox tb = new TextBox();
        tb.ID = "TextBoxSearchCriteria1";
        //The first column
        cell = new TableCell();
        tb = new TextBox();
        cell.Controls.Add(tb);
        cells[0] = cell;


        //The second column
        cell = new TableCell();
        TextBox tb2 =  new TextBox();
        tb2.ID = "TextBoxSearchCriteria2";
        cell.Controls.Add(tb2);
        cells[1] = cell;


        return cells;
    }




1 comment:

Anonymous said...

How are you handling SelectedIndexChanged of the grid? When I select a row it blanks out everything in the grid?