we are upgrading from Ingragistics 10 to 14 version . so in my page i had ULTRAWEBGRID which i am upgrading to WEbDataGrid
so i am s loloking for display lay out and could not find on WDG , I need to convert the below from UWG to WDG(webdatagrid) and its really urgent , kindly reply
<DisplayLayout RowHeightDefault="16px" Version="4.00" BorderCollapseDefault="Separate" CellClickActionDefault="RowSelect" RowSelectorsDefault="No" Name="LicenseGrid" AllowDeleteDefault="Yes" AllowUpdateDefault="No" AllowColSizingDefault="Fixed" FixedCellStyleDefault-Font-Names="Arial" TableLayout="Auto" > <AddNewBox style="border-width:1px;;background-color:lightgray"> </AddNewBox> <Pager style="border-width:1px;border-style:solid;background-color:lightgray"> </Pager> <HeaderStyleDefault Height="16px" Font-Size="X-Small" Font-Names="Arial" Font-Bold="True" BorderStyle="Solid" ForeColor="Black" BackColor="#86C9EC" CustomRules="background-image:url(/AMF/images/pei_TableHeaderImage_blue.png);background-repeat:repeat-x;"> <Padding Bottom="4px" Left="4px" Top="4px" Right="4px"></Padding> <BorderDetails ColorTop="#86C9EC" WidthLeft="0px" WidthTop="0px" ColorLeft="#86C9EC" ColorBottom="#86C9EC" WidthBottom="1px"></BorderDetails> </HeaderStyleDefault> <FrameStyle BorderWidth="1px" Font-Size="XX-Small" Font-Names="Arial" BorderStyle="Solid" HorizontalAlign="Justify" BorderColor="#86C9EC"> </FrameStyle> <FooterStyleDefault BorderWidth="1px" BorderStyle="Solid" BackColor="LightGray"> <BorderDetails ColorTop="White" WidthLeft="1px" WidthTop="1px" ColorLeft="White"> </BorderDetails> </FooterStyleDefault> <ClientEvents /> <EditCellStyleDefault BorderWidth="0px" BorderStyle="None"> </EditCellStyleDefault> <SelectedRowStyleDefault Font-Bold="True" ForeColor="White" BackColor="#000080" CustomRules="background-image:url(/AMF/images/pei_SelectedItemImage_blue.png);background-repeat:repeat-x;"> </SelectedRowStyleDefault> <RowAlternateStyleDefault> </RowAlternateStyleDefault> <RowStyleDefault Cursor="Default" BorderWidth="1px" BorderColor="Black" BorderStyle="Solid" BackColor="White"> <Padding Left="3px"></Padding> <BorderDetails WidthLeft="0px" WidthTop="0px"></BorderDetails> </RowStyleDefault> </DisplayLayout>
Hello Sreevani,
Thank you for posting in our community.
Styling WebDataGrid could be achieved via the css files attached to the grid by default. In this css files there are classes applied to the different elements of the grid, that you could modify in order to achieve the desired look and feel for the grid. A list with css classes used for each control could be found at:
http://ko.infragistics.com/community/blogs/engineering/archive/2010/08/10/which-are-my-css-files.aspx
The CSS file for the WebDataGrid is ig_dataGrid.css and is located in the ig_res/Default folder in your application(if you are using any style sheet different than the Default this file is going to be named after it). For example, if you would like to modify the grid header, you could modify the .igg_Header class, or for the grid cells the tbody.igg_Item>tr>td is the class that you are looking for and etc. Please note that css selectors, that are used to select the target element, are crucial for this way of styling. I believe you might consider the following article with CSS styling guide helpful:
http://ko.infragistics.com/community/blogs/engineering/archive/2010/08/25/webdatagrid-css-styling-guide.aspx
Additionally, what I can suggest is inspecting the elements that you would like to style with any of the browser development tools(such as Firebug) in order to check which classes are applied to any particular element.
I hope you find this information helpful.
Please feel free to contact me if you need any further assistance with this matter.
Please let me know if you need any further assistance with this matter.