Wrap the text on Gridview.
Hi Good day to All
After a long time , i am back - i have no time to post the Resources here . now , i will try to post atleast one Resource per day.
I wish you all a Very Happy Diwali
Now i am going to see how to Wrap the text show in the Gridview , I had searched many links & sites finally i got one javascript.
place the javascript at the Top of the page ie: loaded when the page Loads.
<script type="text/javascript">
window.onload = function()
{
if (window.attachEvent == undefined)
{
var tag = document.getElementsByTagName("td");
for (var i = 0; i < tag.length; i++)
{
if (tag.item(i).className == "wordwrap")
{
var text = tag.item(i).innerHTML;
tag.item(i).innerHTML = text.replace(/(.*?)/g, "<wbr/>");
}
}
}
}
</script>
And one thing you are going to consider , here you have to apply the class="wordwrap" on your td tag at where you want text wrap or which column wants the text wrap then you have to specify the width in px not in % or any.This is my Sample Gridview code
<asp:GridView ID="userList_GridView" runat="server" AllowPaging="True" AutoGenerateColumns="False" BorderColor="WhiteSmoke" BorderWidth="0px" CellPadding="5" EmptyDataText="User not found...!" Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" PageSize="30" ToolTip="User List....!" Width="100%" GridLines="None" BackColor="WhiteSmoke" > <Columns> <asp:TemplateField> <HeaderTemplate> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr style=" color: Black;" class ="fbtxt"> <td align="left" style="width: 18%"> Username </td> <td align="left" style="width: 14%"> Email </td> <td align="center" style="width: 15%"> Resource Permission </td> <td align="center" style="width: 11%"> Permission </td> <td align="center" style="width: 7%"> Edit </td> <td align="center" style="width: 8%"> Delete </td> </tr> </table> </HeaderTemplate> <HeaderStyle BackColor="LightSteelBlue" Font-Bold="True" Font-Size="10pt" ForeColor="Black" /> <ItemTemplate> <div style ="width :100%;table-layout:fixed;border:0px;"> <div class ="fntxt"> <div align="left" style="width: 165px; word-wrap:break; float:left ;" class="wordwrap"> <%# Eval("username")%> </div> <div align="left" style="width: 150px;float:left;" class="wordwrap" > <%#Eval("email")%> </div> <div align="left" style="width: 20%;float:left;" > <a href ='<%# "resourceaccess.aspx?userResource=" + Eval("username") %>' class ="WhiteLink"> Resource Access</a> </div> <div align="left" style="width: 13%;float:left;" > <a href= '<%# "userlist.aspx?userPermission=" + Eval("username") %>' class ="WhiteLink"> <%# Eval("approve") %></a> </div> <div align="center" style="width: 12%;float:left;" > <asp:HyperLink ID="Edit_HyperLink" runat="server" NavigateUrl='<%# "~/Admin/userlist.aspx?editUser=" + Eval("username") %>' CssClass ="WhiteLink" OnClick="return confirm('Are you sure want to Edit this record ?');" Text="Edit" ToolTip="Edit user list....!"></asp:HyperLink> </div> <div align="center" style="width: 7%;float:left;" > <asp:HyperLink ID="Delete_Button" runat="server" NavigateUrl='<%# "~/Admin/userlist.aspx?delUname=" + Eval("username") %>' CssClass ="WhiteLink" OnClick="return confirm('Are you sure want to Delete this record ?');" Text="Delete" ToolTip="Delete user list....!"></asp:HyperLink> </div> </div> </div> </ItemTemplate> </asp:TemplateField> </Columns> <PagerStyle BackColor="WhiteSmoke" Font-Bold="False" Font-Names="verdana" Font-Size="8pt" ForeColor="Red" HorizontalAlign="Center" /> </asp:GridView>
Read more »