setting width of datagrid generated by Dynamic data (Entity framework, in .net)

Question

Hi

I am generating editable data grids from tables using dynamic data, however, i am unable to set the width of the tables/grids.

Can someone please point me to an article/ or suggest how i can do this?

Thanks in advance.

Regards. Kulu.

Answer 1

You can just add CSS on your HTML using the syntax of the name of the dynamic data control, but this must be the exact name used as ID of the control.

For example, if your dynamic data grid with the name of grid1 is inside of panel named panel1, the id will be: "panel1_grid1". the CSS will be:

TABLE#panel1_grid1
{
   width: 600px;
}

A sample workaround in Javascript can be found in this:

http://forums.asp.net/t/1270184.aspx

Answer 2

Styles are applied to the pages generated by DynamicData with CSS. By Default the GridView on the List.aspx Page Template has a CssClass="gridview". That class has quite a few styles defined in the default Site.css file. including this one:

table.gridview { width: 100%; }

You can change the width value there to make a Global change everywhere this class is used (probably not what you are looking for). If you would like to change the width for just one entity/page you should probably make a Custom Page for that entity.

Steps

1. Create a new Folder within the ~/DynamicData/CustomPages directory with the same name as the EntitySet/Collection of your entity (ex: ~/DynamicData/CustomPages/Employees for the Employee entity)
2. Copy the List.aspx page from the ~/DynamicData/PageTemplates directory into the new directory you just created. (you may need to adjust the namespace of the CodeBehind/aspx file)
3. Using a custom CSS class (or explicitly in the .aspx file) change the width of the GidView on the page.

more info: http://www.asp.net/learn/3.5-SP1/video-445.aspx