There are currently 16 columns that I want to display in data grid. I use 97% width for the data grid and 100% for the table that covers the data grid. The problem is that different users use different screen resolutions and browsers nowadays.
As a result, the table is rendering differently based on those two factors. I am wondering if it would be common to fix the width of the data grid and users have to scroll to the right themselves. The problem is that my manager does not want to have a scrollbar.
He wants to know what Common/Best Practices are.
I only have three cases in mind now, but none of them seems to be good.
1. Tell my manager that 16 columns at least in one data grid to be displayed is too much. The thing is I do not know what is the common/best practice.
2. Fix the width of the data grid. He does not like unless this is the common/best practice. My manager only wants documentation that is trustable to backup my point.
3. Have to show/render the 16 columns correctly in every browser in every screen resolution.
Definately a scrollbar is needed, why would 1 even think about not having a horizontall scroll bar
with 16 columns.
The only possible case for 16 columns could be the fact that the column title should be one word long
and cell data to be 1 or 2 digits only, this way all the data can be presented without scorll bar
But I think generally we have different lengths of records inside grid view cells
this does not seem to be a case for finding a best practice
it should be finding best solution with or without scrollbar, that satisfies end users
I would agree with you that there should be a horizontal with 16 columns. However, there are two ways to have a horizontal scroll bar.
1. Fix the width of the Grid. This will make my life easier because it will show the same width for example 800px for all resolutions. The scroll bar will always there.
PRO: easier to manage and code. Show the same thing with all resolutions.
CON: for high resolution, some users would expect to see all columns since their screens are big enough and that's there expectaction!
2. Make % of width on the Grid.
PRO: for high resolution, can see all columns.
CON: when it's low resolution, the horizontal scroll bar will be created automatically and it messes up with different browser.
I guess I don't know what's the convention for how many columns should be displayed and whether the size should be fixed or center align or right align. For example, I notice that YouTube just changed their website to be left align and fix the width of the
site. It looks kind of weird on my big screen. However, I believe they do that for reasons.
Every web site owner has its own rules to follow, thats why all the famous web sites do not simply follow one and only one
approach, same was my point for focusing on what is required as it is purely a customized solution that is not very common
(after all u dont see such number of columns in web sites)
Ok, put the grid view inside a panel, set its property width to: 100%
then it will be easy to scale for other browsers with high or low resolution
Put horizontall scrollbar as auto
And dont waste your time for running after same UI experience on all browsers
it simply cannot be. If you still want to, then post the problem at some famous/official CSS forum
and ask for suggestions to meet your requirements, CSS guys could help you getting close to all-browser web site
for almost same UI experience
scharusaengr...
Member
6 Points
14 Posts
Best practices for numbers of columns in the data grid (GridView)
Dec 20, 2012 10:14 PM|LINK
Hi there,
There are currently 16 columns that I want to display in data grid. I use 97% width for the data grid and 100% for the table that covers the data grid. The problem is that different users use different screen resolutions and browsers nowadays. As a result, the table is rendering differently based on those two factors. I am wondering if it would be common to fix the width of the data grid and users have to scroll to the right themselves. The problem is that my manager does not want to have a scrollbar. He wants to know what Common/Best Practices are.
I only have three cases in mind now, but none of them seems to be good.
1. Tell my manager that 16 columns at least in one data grid to be displayed is too much. The thing is I do not know what is the common/best practice.
2. Fix the width of the data grid. He does not like unless this is the common/best practice. My manager only wants documentation that is trustable to backup my point.
3. Have to show/render the 16 columns correctly in every browser in every screen resolution.
If you have any solution, please advise.
Is it because we have too many columns or we
usman400
Contributor
3513 Points
721 Posts
Re: Best practices for numbers of columns in the data grid (GridView)
Dec 21, 2012 03:37 AM|LINK
Definately a scrollbar is needed, why would 1 even think about not having a horizontall scroll bar
with 16 columns.
The only possible case for 16 columns could be the fact that the column title should be one word long
and cell data to be 1 or 2 digits only, this way all the data can be presented without scorll bar
But I think generally we have different lengths of records inside grid view cells
this does not seem to be a case for finding a best practice
it should be finding best solution with or without scrollbar, that satisfies end users
prabu.raveen...
Contributor
5020 Points
955 Posts
Re: Best practices for numbers of columns in the data grid (GridView)
Dec 21, 2012 05:07 AM|LINK
Try as below,
<div style="width: 100%">
<asp:GridView ID="gridFiles" runat="server" AutoGenerateColumns="false" CssClass="GVStyle"
GridLines="Both" Width="100%">
<Columns>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="7%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="7%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="7%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="7%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name">
<ItemStyle HorizontalAlign="Center" Width="6%"></ItemStyle>
</asp:BoundField>
</Columns>
</asp:GridView>
</div>
scharusaengr...
Member
6 Points
14 Posts
Re: Best practices for numbers of columns in the data grid (GridView)
Dec 21, 2012 04:31 PM|LINK
I would agree with you that there should be a horizontal with 16 columns. However, there are two ways to have a horizontal scroll bar.
1. Fix the width of the Grid. This will make my life easier because it will show the same width for example 800px for all resolutions. The scroll bar will always there.
PRO: easier to manage and code. Show the same thing with all resolutions.
CON: for high resolution, some users would expect to see all columns since their screens are big enough and that's there expectaction!
2. Make % of width on the Grid.
PRO: for high resolution, can see all columns.
CON: when it's low resolution, the horizontal scroll bar will be created automatically and it messes up with different browser.
I guess I don't know what's the convention for how many columns should be displayed and whether the size should be fixed or center align or right align. For example, I notice that YouTube just changed their website to be left align and fix the width of the site. It looks kind of weird on my big screen. However, I believe they do that for reasons.
Any thoughts?
Dan Bracuk
Contributor
3970 Points
1096 Posts
Re: Best practices for numbers of columns in the data grid (GridView)
Dec 21, 2012 04:35 PM|LINK
Horizontal scrolling stinks to high heaven. Do you enjoy doing it? If not, why subject others to it?
usman400
Contributor
3513 Points
721 Posts
Re: Best practices for numbers of columns in the data grid (GridView)
Dec 22, 2012 05:07 AM|LINK
Every web site owner has its own rules to follow, thats why all the famous web sites do not simply follow one and only one
approach, same was my point for focusing on what is required as it is purely a customized solution that is not very common
(after all u dont see such number of columns in web sites)
Ok, put the grid view inside a panel, set its property width to: 100%
then it will be easy to scale for other browsers with high or low resolution
Put horizontall scrollbar as auto
And dont waste your time for running after same UI experience on all browsers
it simply cannot be. If you still want to, then post the problem at some famous/official CSS forum
and ask for suggestions to meet your requirements, CSS guys could help you getting close to all-browser web site
for almost same UI experience