Wednesday, May 30, 2012

Wrap the data in Gridview

Sometime the data in Gridview column is large and it makes the scrollbar to appear on the page. Due to which User Interface of page get effected.

Here are two solutions for achieving the required wrapping.

Why two solution are provided?
The reason is that sometime solution 1 doesn't work for all browser. It vary with the way how you are pulling the data in Gridview.

Solution 1:
Putting <ItemStyle> tag and setting the width of column.
Wrapping the data using <ItemStyle> tag
Wrapping the data using <ItemStyle> tag

Solution 2:
Putting <div> tag and styling on bounded column (Works on all browsers)

Wrapping the data using <div> tag and styling
Wrapping the data using <div> tag and styling


Output: 
Here is the output how data displayed in Gridview is wrapped.

Gridview Wrapping
Gridview wrapping








Keep posting your queries to get optimum solution.