Show Gridlines on a Grid

Eric picture Eric · Mar 10, 2010 · Viewed 13.2k times · Source

I'm using Rad Grids and I use the built in Skins for appearance. However, I 'd like to add Gridlines for my Grid. Gridlines = "Both" does not seem to work.

 <telerik:RadGrid ID="RadGridProviders" Width="100%" GridLines="Both" AllowPaging="true" Skin="WebBlue" runat="server"  DataSourceID="SDSProvider" AutoGenerateColumns="false">
                    <MasterTableView DataSourceID="SDSProvider" PageSize="7" CellPadding="0" GridLines="Both" CellSpacing="0" DataKeyNames="ID,Entry_Loc" AllowMultiColumnSorting="True" AutoGenerateColumns="false"  >
                     <PagerStyle Mode="NextPrevNumericAndAdvanced"/>
                     <Columns>
                        <telerik:GridBoundColumn HeaderText="Organization Name" HeaderStyle-HorizontalAlign="Center" DataField="OrgName" SortExpression="OrgName">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn HeaderText="Provider Type" HeaderStyle-HorizontalAlign="Center" DataField="TypeofProvider" SortExpression="TypeofProvider">
                        </telerik:GridBoundColumn>
                         <telerik:GridBoundColumn HeaderText="Contact Name" HeaderStyle-HorizontalAlign="Center" DataField="Contact" SortExpression="Contact">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn HeaderText="Address" HeaderStyle-HorizontalAlign="Center" DataField="Address" SortExpression="Address">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn HeaderText="Contact Number" HeaderStyle-HorizontalAlign="Center" DataField="Phone" SortExpression="Phone">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn HeaderText="Creator Location" Visible="false" HeaderStyle-HorizontalAlign="Center" DataField="Entry_Loc" SortExpression="Entry_Loc">
                        </telerik:GridBoundColumn>
                        <telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Delete" HeaderText="Delete Provider" HeaderStyle-HorizontalAlign="Center" 
                            ConfirmText="Are You Sure You Want to Delete this Provider?" ConfirmDialogType="RadWindow" ConfirmTitle="Delete Provider Confirmation"
                            UniqueName="DeleteProv">
                        </telerik:GridButtonColumn> 
                     </Columns>
                    </MasterTableView>
                    </telerik:RadGrid>

I just tried adding custom CSS

.mytable tr td
    {
                border: solid 1px #000000;
    }

I set the css class for the item style inside of the masterr table, i set it on the master table and on the grid itself. Didn't work.

Answer

Andrew Bezzub picture Andrew Bezzub · Mar 10, 2010

Your skin may not support grid lines. You can try using another skin to check this or use firebug. If skin does not support grid lines you will need to add them manually with custom css/skin.

Here is description of RadGrid css classes: http://www.telerik.com/help/aspnet-ajax/grdcreatingnewskins.html

You can try customizing existing skin or use something like:

.RadGrid_WebBlue .rgRow td
{
    border: solid 1px #000000;
}