This is a migrated thread and some comments may be shown as answers.

Hide Grid Lines from Filtering row

5 Answers 305 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Sanjeev
Top achievements
Rank 1
Sanjeev asked on 26 Mar 2010, 03:54 PM
Hi,
    We have remove the grid line by useing ItemStyle-BorderStyle="None" and HeaderStyle-BorderStyle="None" properties and it's working fine for the header and the 
DataItem row but the grid lines are still visible for the 1st row ( i.e the row just below the header ).
One more issue is here any way to make those row height more lessen(desired) for the grid row.
Basically we want to impliment the those features without using the css file only by setting the Grid properties.


Thanks,
Sanjeev

5 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 26 Mar 2010, 06:12 PM
Hello Sanjeev,

The filtering row borders can be removed only with a CSS rule. So you can use it to remove all borders, instead of using properties in the control declaration. Here is a simple demo.

<%@ Page Language="C#" %>
<%@ Import Namespace="System.Data" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
 
<script runat="server">
 
    protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
    {
        DataTable dt = new DataTable();
        DataRow dr;
        int colsNum = 4;
        int rowsNum = 5;
        string colName = "Column";
 
        for (int j = 1; j <= colsNum; j++)
        {
            dt.Columns.Add(String.Format("{0}{1}", colName, j));
        }
 
        for (int i = 1; i <= rowsNum; i++)
        {
            dr = dt.NewRow();
 
            for (int k = 1; k <= colsNum; k++)
            {
                dr[String.Format("{0}{1}", colName, k)] = String.Format("{0}{1} Row{2}", colName, k, i);
            }
            dt.Rows.Add(dr);
        }
 
        (sender as RadGrid).DataSource = dt;
    }
 
</script>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 
<head runat="server">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>RadControls</title>
<style type="text/css">
 
div.RadGrid .rgHeader,
div.RadGrid th.rgResizeCol,
div.RadGrid .rgRow td,
div.RadGrid .rgAltRow td,
div.RadGrid .rgFilterRow td,
div.RadGrid .rgEditRow td,
div.RadGrid .rgFooter td
{
    border-left-width:0;
}
 
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
 
<telerik:RadGrid
    ID="RadGrid1"
    runat="server"
    Width="600px"
    AllowFilteringByColumn="true"
    Skin="Office2007"
    OnNeedDataSource="RadGrid_NeedDataSource">
</telerik:RadGrid>
 
</form>
</body>
</html>


Best wishes,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Sanjeev
Top achievements
Rank 1
answered on 27 Mar 2010, 07:24 AM
Hi Dimo,
Thanks for the code piece it's really worked for me.
One more question can you provide some help on removing the all style from footer of grid.
Thanks,
Sanjeev
0
Dimo
Telerik team
answered on 29 Mar 2010, 09:38 AM
Hi Sanjeev,

"removing the all style from footer of grid"

Which styles exactly? You can remove all footer borders like this:

div.RadGrid  .rgFooter  td
{
    border-width:0;
}


Regards,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Sanjeev
Top achievements
Rank 1
answered on 29 Mar 2010, 11:38 AM
Hi,
    Basically we want to remove all the style applied to classes below i tried by follow code but it's not working for me.

.RadGrid_Office2007 .rgCommandTable 
{
border:none;
}

.RadGrid_Office2007 tfoot .rgCommandCell
{
border: none;
}
.RadGrid_Office2007 .rgCommandRow 
{
}

Thanks,
Sanjeev
0
Dimo
Telerik team
answered on 29 Mar 2010, 12:06 PM
Hi Sanjeev,

Please refer to the following blog post to find out what is CSS specificity and how to use it:

http://blogs.telerik.com/dimodimov/posts/08-06-17/how_to_override_styles_in_a_radcontrol_for_asp_net_ajax_embedded_skin.aspx


Kind regards,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Tags
Grid
Asked by
Sanjeev
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Sanjeev
Top achievements
Rank 1
Share this question
or