[Solved] Set the alternateitemstyle with border color,style and width

[Jini A B]

Respected Sir,

   I have a doubt in setting the Radgrid Alternateitemstyle property.i had written the code like this in common skin of the radgrid.But it doesnt shows the effects and the selected row is highlighted by the blue .
the code is like this:
 
<telerik:RadGrid EnableEmbeddedSkins=false AlternatingItemStyle-BackColor="#f6f6f6"
    runat="server" Skin="Web20">

   <ClientSettings  EnableRowHoverStyle="True" >
    <Selecting AllowRowSelect="True" />
    <ClientEvents OnRowSelecting="RowSelecting" />
   </ClientSettings>
  <ItemStyle  BorderStyle="Solid" BorderWidth="10px" BorderColor="#00000"   HorizontalAlign="Left"/>
    <AlternatingItemStyle BorderStyle="Solid"  BorderColor="#080808 "  BorderWidth="1px"  HorizontalAlign="Left"  />
</telerik:RadGrid>
Please give me a  solution to fix this problem
                                                                                                                                           Thank you
                                                                                                                                               JINI A B

[Princy]

Hello Jini,

Try setting css styles as shown below and see if it helps:
aspx:

<ItemStyle CssClass="ItemStyle" />
<AlternatingItemStyle CssClass="AltItemStyle"/>

css:

 .ItemStyle td
   {
      border-color:#00000;
      border-bottom-width:2px ;
      border-bottom-style:solid;
      border-top-width:2px;
      border-top-style:solid;
      text-align:left;
    }
 .AltItemStyle td
   {
      border-color:#080808;
      border-bottom-width:2px;
      border-bottom-style:solid;
      border-top-width:2px;
      border-top-style:solid;
      text-align:left;
    }

Thanks
Princy.

[Jini A B]

 i'm  Hereby Attaching a Cancel Image.Here i want to Add the same image in Radgrid Column Like:
 
  <telerik:GridButtonColumn Text="Cancel"    CommandName="Cancel"  UniqueName="column1" >   
                   <HeaderStyle Width="2%"/>
</telerik:GridButtonColumn>
And Also want to do some Action Like Cancel that specified Action.
Can you Please help me to find out one solution for this.
                                                                                                                                                         Thank You
                                                                                                                                                           JINI A B

[Dimo]

Hi Jini,

Set the ButtonCssClass property of the GridButtonColumn and then set your custom image to be a background for the specified CSS class. You will also need to set zero border and transparent background color for the same CSS class.

Sincerely yours,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Jini A B]

How to add a tempalatecolumn in radgrid to perform the action Cancel  with the cancel image

[Dimo]

Hello Jini,

Use a simple button with a Cancel CommandName. You can set a custom CSS class and set your icon as a background image for this CSS class.

<%@ 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 = 4;
        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"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>RadControls</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />

<telerik:RadGrid
    ID="RadGrid1"
    runat="server"
    AutoGenerateEditColumn="true"
    OnNeedDataSource="RadGrid_NeedDataSource">
    <MasterTableView EditMode="InPlace">
        <Columns>
            <telerik:GridTemplateColumn UniqueName="MyCancelEdit">
                <ItemTemplate>
                    <asp:Button ID="Button1" runat="server" CssClass="rgCancel" CommandName="Cancel" Text=" " />
                </ItemTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>

</form>
</body>
</html>

Kind regards,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Jini A B]

i cant written the code like this.Because it already contains a itemdatabound ,Inside that the commandname cancel is called.Here i want to change the backgroung image after when the action that is cancel is happened.Two Backgroaund image is used for the dispaly through the CSS class

[Dimo]

Hi Jini,

I am not sure I understood you correctly, but in this case I suggest you to set the CssClass at runtime in the RadGrid ItemCreated event, depending on preferred conditions (e.g. e.Item.IsInEditMode is true or whatever). In ItemCreated you will have to access the button via the GridTemplateColumn's UniqueName.

http://www.telerik.com/help/aspnet-ajax/grdaccessingcellsandrows.html

If there is anything unclear, please send a simple runnable web page, similar to the one I provided above and tell us what exactly are you trying to do.

Regards,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.