您的位置：首页 > 其它

关于Infragistics UltraWebGrid 单元格自动换行的问题

2007-05-12 10:33 751 查看

Infragistics UltraWebGrid 为开发提供了许多便捷的功能，使本来实现起来较复杂的功能，只通过简单的设置几个属性就能完成。最近的一个项目开发中，用UltraWebGrid 显示一些文本内容，由于内容一般较长，所以在有限宽度的单元格中显示不全，有部分被自动截去了，虽然把鼠标放到单元格上方，在显示的标签中能显示全部内容，但是用户仍不满意。为此，只好研究研究Infragistics UltraWebGrid 单元格自动换行功能。虽然这个功能也是设置几个属性就能实现，但却让我费了一番功夫。在网上查找，也发现不少人问类似功能的实现方法，但都没有完整的答案，所以，我将自己的实现方法写在下面，供有类似需求的朋友参考。

1、实现的效果图如下：

2、建立一个名为WebGrid.aspx的页面，代码如下：

<%...@ Page Language="C#" AutoEventWireup="true" CodeFile="WebGrid.aspx.cs" Inherits="WebGrid" %>

<%...@ Register Assembly="Infragistics2.WebUI.UltraWebGrid.v5.3, Version=5.3.20053.73, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb"

Namespace="Infragistics.WebUI.UltraWebGrid" TagPrefix="igtbl" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>WebGrid单元格换行</title>

</head>

<body>

<div>

<strong>UltraWebGrid 单元格换行效果<br />

</strong>

<br />

<igtbl:UltraWebGrid ID="UltraWebGrid1" runat="server" Width="400px">

<Bands>

<igtbl:UltraGridBand>

</AddNewRow>

</igtbl:UltraGridBand>

</Bands>

<DisplayLayout AllowColSizingDefault="Free" AllowColumnMovingDefault="OnServer" AllowDeleteDefault="Yes"

AllowSortingDefault="OnClient" AllowUpdateDefault="Yes" BorderCollapseDefault="Separate"

HeaderClickActionDefault="SortMulti" Name="UltraWebGrid1" RowHeightDefault="20px" SelectTypeRowDefault="Extended" Version="4.00" ViewType="OutlookGroupBy">

</GroupByBox>

</GroupByRowStyleDefault>

</FooterStyleDefault>

</RowStyleDefault>

</HeaderStyleDefault>

</EditCellStyleDefault>

<FrameStyle BackColor="Window" BorderColor="InactiveCaption" BorderStyle="Solid"

BorderWidth="1px" Font-Names="Microsoft Sans Serif" Font-Size="8.25pt"

Width="400px">

</FrameStyle>

<Pager>

<Style BackColor="LightGray" BorderStyle="Solid" BorderWidth="1px">...

</Style>

</Pager>

<Style BackColor="Window" BorderColor="InactiveCaption" BorderStyle="Solid" BorderWidth="1px">...

</Style>

</AddNewBox>

</DisplayLayout>

</igtbl:UltraWebGrid></div>

</form>

</body>

</html>

3、页面的后台代码如下：

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

public partial class WebGrid : System.Web.UI.Page

...{

protected void Page_Load(object sender, EventArgs e)

...{

DataTable dt = new DataTable();

dt.Columns.Add("测试列");

dt.Rows.Add(new object[] ...{ "欢迎访问小小程序员oneiter的csdn博客，欢迎探讨开发过程中的技术问题。" });

dt.Rows.Add(new object[] ...{ "本文提供了关于UltraWebGrid中单元格内容自动换行的实现方式！" });

dt.Rows.Add(new object[] ...{ "The only way to resize the rows is at the client side. At client side you need to determine the total length of the text for each row and then calculate how much row height needs to be resized?" });

dt.Rows.Add(new object[] ...{ "This is an example using JavaScript" });

dt.Rows.Add(new object[] ...{ "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" });

dt.Rows.Add(new object[] ...{ "11111111111111111111111111111111111111111111111111111111" });

//bind data to grid

UltraWebGrid1.DataSource = dt;

UltraWebGrid1.DataBind();

//enable wrapping of text

UltraWebGrid1.Columns[0].CellStyle.Wrap = true;

//set the StationaryMargin (TableLayout becomes fixed)

UltraWebGrid1.DisplayLayout.StationaryMargins = Infragistics.WebUI.UltraWebGrid.StationaryMargins.HeaderAndFooter;

//set the size of the width

UltraWebGrid1.Columns[0].Width = 250;

}

}

4、说明：（1）以上是我测试该功能实现时做的一个简单的例子，把代码全部贴在上面，是为了想测试一下的朋友直接利用，其实实现该功能的代码就是那三行关于属性设置的；（2）我在这个例子中用的控件版本是2005.3.2，其它版本应该类似，我没有测试过；（3）为了保证英文单词和数字显示的正确，如果单元格中的文本是一串连续的字母或者数字的话，将不会自动换行，我上面的例子中也演示了这点。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航