Solved

Wrap Text in a Gridview row asp.net

Posted on 2010-11-09
8
2,120 Views
Last Modified: 2012-05-10
I have a field that I am binding into a gridview control which is very large ( it holds comments) and it can be vey long. How can I make that row column to auto wrap the text so it doesnt go across the screen, please see the attached file..

thanks

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
        CellPadding="4" DataKeyNames="ID" DataSourceID="AccessDataSource1" 
        EnableModelValidation="True" Width="962px" AllowPaging="True" 
        ForeColor="Black" GridLines="Horizontal" 
        style="font-family: Arial, Helvetica, sans-serif" AllowSorting="True" 
        BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" w
        BorderWidth="1px" CssClass="GridColumn">
            <Columns>
            <asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False" 
                ReadOnly="True" SortExpression="ID" HeaderStyle-Width="80px" 
                ItemStyle-Width="80px" HeaderStyle-HorizontalAlign="Center" 
                ItemStyle-HorizontalAlign="Center" ControlStyle-CssClass="GridColumn">
            </asp:BoundField>
            <asp:BoundField DataField="created" HeaderText="created" 
                SortExpression="created" HeaderStyle-HorizontalAlign="Center" 
                    ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="80px" 
                    ItemStyle-Width="80px" >
                </asp:BoundField>
            <asp:BoundField DataField="submited by" HeaderText="submited by" 
                SortExpression="submited by" HeaderStyle-Width="80px" 
                ItemStyle-Width="80px" HeaderStyle-HorizontalAlign="Center" 
                ItemStyle-HorizontalAlign="Center">
            </asp:BoundField>
            <asp:BoundField DataField="preferred contact method" 
                HeaderText="preferred contact method" SortExpression="preferred contact method" 
                ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" >
            </asp:BoundField>
            <asp:BoundField DataField="E-Mail" HeaderText="E-Mail" 
                SortExpression="E-Mail" HeaderStyle-Width="120px" ItemStyle-Width="120px" 
                ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center">
            </asp:BoundField>
            <asp:BoundField DataField="Phone" HeaderText="Phone" 
                SortExpression="Phone" ItemStyle-HorizontalAlign="Center" 
                HeaderStyle-HorizontalAlign="Center" >
            </asp:BoundField>
            <asp:BoundField DataField="Comments" HeaderText="Comments" 
                SortExpression="Comments" ItemStyle-HorizontalAlign="Left" 
                HeaderStyle-HorizontalAlign="Left" ItemStyle-Wrap="True" 
                    HeaderStyle-Wrap="True">
        
            </asp:BoundField>
            <asp:BoundField DataField="Status" HeaderText="Status" 
                SortExpression="Status" HeaderStyle-HorizontalAlign="Center" 
                    ItemStyle-HorizontalAlign="Center" >
                </asp:BoundField>
        </Columns>
            <EditRowStyle Wrap="True" />
        <FooterStyle BackColor="#CCCC99" ForeColor="Black" />
        <HeaderStyle BackColor="#333333" Font-Bold="True" ForeColor="White" Wrap="True" />
        <PagerStyle BackColor="White" ForeColor="Black" />
        <SelectedRowStyle BackColor="#CC3333" Font-Bold="True" ForeColor="White" 
                Wrap="True" />
    </asp:GridView>

Open in new window

Doc1sample.doc
0
Comment
Question by:TonyReba
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 4
8 Comments
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 34099063
Hi TonyReba,
You can apply wrap="true" in the applied column.
Check this fixed:
http://bit.ly/cLnAiD
0
 
LVL 9

Author Comment

by:TonyReba
ID: 34099074
can you modify the above code?

I can't make it work!
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 34099105
Can you show the CSS code for "GridColumn"? I'm suspecting this has overridden the existing layout even you've turned on the text wrap property.
0
Guide to Performance: Optimization & Monitoring

Nowadays, monitoring is a mixture of tools, systems, and codes—making it a very complex process. And with this complexity, comes variables for failure. Get DZone’s new Guide to Performance to learn how to proactively find these variables and solve them before a disruption occurs.

 
LVL 9

Author Comment

by:TonyReba
ID: 34099131
Is doing nothing, I tried applying into the grid view columns
0
 
LVL 9

Author Comment

by:TonyReba
ID: 34099133
.GridColumn
{
      white-space: pre-wrap; /* css-3 */
      white-space: pre-line;
      white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
      white-space: -pre-wrap; /* Opera 4-6 */
      white-space: -o-pre-wrap; /* Opera 7 */
      word-wrap: break-word;
}
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 34099575
Hi TonyReba,
It should be work as though if the user key in "Normal" comment instead of try to spam your comment section. At least i don't see any words that have such "Long" comment (non-stop with any space). In that case, you need to write custom code to detect and break it if you like to display this entered abnormal words into wrapped mode.
0
 
LVL 9

Author Comment

by:TonyReba
ID: 34101680
I think works on ie. But not in chrome??
0
 
LVL 29

Accepted Solution

by:
David H.H.Lee earned 500 total points
ID: 34108635
Perhaps you can try jQuery plugin - .wrap() method to output the content.
http://api.jquery.com/wrap/
0

Featured Post

Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article will inform Clients about common and important expectations from the freelancers (Experts) who are looking at your Gig.
When it comes to security, close monitoring is a must. According to WhiteHat Security annual report, a substantial number of all web applications are vulnerable always. Monitis offers a new product - fully-featured Website security monitoring and pr…
The viewer will learn how to count occurrences of each item in an array.
Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question