repeater实现多列显示

repeater实现多列显示


一、下面的代码实现,每行显示三列

前台代码:
<table>
<tr>
<asp:repeater id="Repeater1" runat="server">
<ItemTemplate>
<td><%#DataBinder.Eval(Container.DataItem,"thing")%></td>
</ItemTemplate>
</asp:repeater>
</tr>
</table>

后台代码:
protected int i=1;
 
  private void Page_Load(object sender, System.EventArgs e)
  {

   XmlSerializer ser = new XmlSerializer(typeof(DataSet));
   DataSet ds = new DataSet("myDataSet");
   DataTable t = new DataTable("table1");
   DataColumn c = new DataColumn("thing");
   t.Columns.Add(c);
   ds.Tables.Add(t);
   DataRow r;
   for(int i = 0; i<10;i++)
   {
    r = t.NewRow();
    r[0] =  i;
    t.Rows.Add(r);
   }
   this.Repeater1 .DataSource =ds.Tables [0].DefaultView ;
   this.Repeater1.DataBind ();
  }

private void Repeater1_ItemDataBound(object sender, System.Web.UI.WebControls.RepeaterItemEventArgs e)
  {
   if(i%3==0&&i>0)
   {
     e.Item.Controls.Add(new LiteralControl("</tr><tr>"));
   }
   i++;
  }

 用div+css的话可以实现
而且如果内容不是很复杂的话,datalist就可以实现多行多列了

源自:http://www.cnblogs.com/bccu/archive/2006/10/24/538506.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
感谢您的问题,以下是关于您的问题的回答: 首先,要创建一个可拖动列宽的多列表格,可以使用 Qt Quick 中的 ListView 和 ListModel。接下来,建议使用 Repeater 元素来生成多个列,并在列中使用 Text 元素来显示表头和表格数据。 然后,您需要在每个列头上放置一个 MouseArea 元素,以便用户可以通过拖动列头中间的线来调整列宽。当用户按下 MouseArea 时,您可以在列头上创建一个虚线框,以指示用户正在调整列宽。然后,在用户释放 MouseArea 时,您可以更新 ListModel 中的数据,以反映新的列宽,并刷新 ListView 中的所有列以显示更新后的数据。 以下是代码示例,以帮助您更好地理解这个过程: ``` ListView { id: listView width: parent.width height: parent.height // 绑定数据模型 model: myListModel // 使用 Repeater 元素生成多个列 delegate: Repeater { model: myHeaderData.length // 列数 Column { id: column width: myColumnWidths[index] // 列宽 spacing: 5 Text { text: myHeaderData[index] // 表头数据 font.bold: true } Repeater { model: myData.length // 行数 Text { text: myData[index][myHeaderData[index]] // 表格数据 } } // 列头 MouseArea 元素 MouseArea { id: mouseArea anchors.fill: parent drag.target: column // 拖动的目标为列 drag.axis: Drag.XAxis // 限制只能水平拖动 drag.minimumX: column.width / 2 // 拖动最小值为列宽的一半 drag.maximumX: parent.width - column.width / 2 // 拖动最大值为 ListView 的宽度减去列宽的一半 onPressed: { // 创建虚线框 virtualLine.x = column.x + column.width virtualLine.height = parent.height virtualLine.visible = true } onReleased: { // 更新列宽 myColumnWidths[index] = column.width // 隐藏虚线框 virtualLine.visible = false // 刷新 ListView listView.contentItem.children[index].children[1].children[1].children[index].width = column.width listView.contentItem.children[index].children[1].children[2].children[index].width = column.width } } } } } // 虚线框 Rectangle { id: virtualLine width: 1 color: "blue" dashPattern: [5, 5] visible: false z: 9999 } ``` 请注意,代码示例中的变量和数据需要根据您的实际情况进行调整。希望这可以帮助您实现您的多列表格。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值