asp.net 如何向Table增加一行或多行?

Jack123 2008-12-22 11:14:20

<table border="1" id="test" runat="server">
<tr>
<td >
Row1
</td>
</tr>
<tr>
<td >
Row2
</td>
</tr>
<tr>
<td >
Row3
</td>
</tr>
</table>


点击第1行，如何在第1行与第2行之间增加加一行？
点击第2行，如何在第2行与第3行之间增加加两行？
...


不用JavaScript，用c#或vb.net


...全文
1083 20 打赏 收藏 转发到动态 举报
写回复
用AI写文章
20 条回复
切换为时间正序
请发表友善的回复…
发表回复
Eagle_ice 2008-12-22
  • 打赏
  • 举报
 回复
4楼的可以...9楼的JS也不错...
Fibona 2008-12-22
  • 打赏
  • 举报
 回复
<script type="text/javascript">
function AddRow(index)
{
var tObj=document.getElementById("test");
var row=tObj.insertRow(index);//在第一行之后,如果是-1,则插入到最后一行
var cell=row.insertCell(-1);
cell.innerHTML="这就是在第一行后插入的";
}
</script>
<table border="1" id="test" runat="server">
<tr onclick="AddRow(1)" id="Row1">
<td >
Row1
</td>
</tr>

<tr>
<td >
Row2
</td>
</tr>
<tr>
<td >
Row3
</td>
</tr>
</table>
andrewsway 2008-12-22
  • 打赏
  • 举报
 回复
顶
Jack123 2008-12-22
  • 打赏
  • 举报
 回复

不论是用JavaScript，还是用.net后台代码 ，

当点击第1行，如何在第1行与第2行之间增加一行呢？

<table border="1" id="test" runat="server">
<tr onclick="AddRow('Row1')" id="Row1">
<td >
Row1
</td>
</tr>

<tr>
<td >
Row2
</td>
</tr>
<tr>
<td >
Row3
</td>
</tr>
</table>




ParryYan 2008-12-22
  • 打赏
  • 举报
 回复
<table cellPadding="0" cellSpacing="0" width="100%">
<tr>
<td width="35%">名称1</td>
<td width="45%">名称2</td>
<td width="20%">日期</td>
</tr>
<tr>
<td height="5"></td>
</tr>
<asp:Repeater ID="RptrMain" EnableViewState="False" Runat="server">
<ItemTemplate>
<tr style="line-height:20px;" valign="top">
<td><%# DataBinder.Eval(Container.DataItem, "CN") %></td>
<td><%# DataBinder.Eval(Container.DataItem, "DN") %></td>
<td><%# DataBinder.Eval(Container.DataItem, "Date") %></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>

C#代码:

DataTable myTable = new DataTable();
myTable.Columns.Add("CN",typeof(string));
myTable.Columns.Add("DN",typeof(string));
myTable.Columns.Add("Date",typeof(string));
DataRow myRow;

for (int iTmp = 1; iTmp <= 10; iTmp ++) {
myRow = myTable.NewRow();
myRow["CN"] = "<a href='/CD.aspx?CI=" + iTmp.ToString().Trim() + "' target='_blank'>"
+ iPageP.ToString().Trim() + "_" + iTmp.ToString().Trim() + "</a>";
myRow["DN"] = "<a href='/CD.aspx?DI=" + iTmp.ToString().Trim() + "' target='_blank'>"
+ iPageP.ToString().Trim() + "_" + iTmp.ToString().Trim() + "</a>";
myRow["Date"] = DateTime.Today.AddDays(-iTmp).ToString().Trim();

myTable.Rows.Add(myRow);
}

RptrMain.DataSource = myTable;
RptrMain.DataBind();
myTable.Clear();

一弗楚 2008-12-22
  • 打赏
  • 举报
 回复
这个问题的麻烦应该不是如何在后台插入行，而是点击表格行到后台得到当前行。
结合JS解决吧。增加一个按钮做中转
lovehongyun 2008-12-22
  • 打赏
  • 举报
 回复
客户端的table最好在客户端做.

如果非要用服务端的.你可以把整个table换成<asp:Table ...这个控件

然后添加tableRow,tableCell即可



<%@ Page Language="C#" AutoEventWireup="True" %>



 <html>

 <head>

     <script language="C#" runat="server">

         void Page_Load(Object sender, EventArgs e) {

             // Generate rows and cells.           

             int numrows = 3;

             int numcells = 2;

             for (int j=0; j<numrows; j++) {          

                 TableRow r = new TableRow();

                 for (int i=0; i<numcells; i++) {

                     TableCell c = new TableCell();

                     c.Controls.Add(new LiteralControl("row " + j.ToString() + ", cell " + i.ToString()));

                     r.Cells.Add(c);

                 }

                 Table1.Rows.Add(r);

             }

         }

     </script>

 </head>

 <body>

     <h3>Table Example, constructed programmatically</h3>

     <form runat=server>

         <asp:Table id="Table1" 

          GridLines="Both" 

          HorizontalAlign="Center" 

          Font-Name="Verdana" 

          Font-Size="8pt" 

          CellPadding=15 

          CellSpacing=0 

          Runat="server"/>

     </form>

 </body>

 </html>
qian6688099 2008-12-22
  • 打赏
  • 举报
 回复
Table1.Rows.Add(New TableRow)
Table1.Rows(0).Cells.Add(New TableCell)
Table1.Rows(0).Cells(0).Text = 11111
deepinnet 2008-12-22
  • 打赏
  • 举报
 回复
给TABLE 插入Row 对象
Jack123 2008-12-22
  • 打赏
  • 举报
 回复
Another topic:
http://topic.csdn.net/u/20081222/14/cb28d4a5-a0ac-408c-9ba0-462753d7def7.html
Jack123 2008-12-22
  • 打赏
  • 举报
 回复
Okay,thanks~
lovehongyun 2008-12-22
  • 打赏
  • 举报
 回复
15楼的代码改一下.一着急写错了

tr.id = "row"+Math.random;
-->改成
tr.id = "row"+Math.random();
lovehongyun 2008-12-22
  • 打赏
  • 举报
 回复
[Quote=引用 16 楼 rejoice123 的回复:]
是的，现在是想要: 点击当前行,就会在当前行的下一行增加一行。

当增加了一行后，再点击这个新增的行，如何再新增一行......


简言之：无论点击页面的哪行（这一行包括 旧的和新增的)，都能在其下面新增1或多行。。。
-----------------------------------------------------------------------------

这个新增行的数据是从数据库中读取出来的,只想动态加载罢了。。

--------------------------------------…
[/Quote]

ok,就是这个意思.参看15楼代码.
Jack123 2008-12-22
  • 打赏
  • 举报
 回复
是的，现在是想要: 点击当前行,就会在当前行的下一行增加一行。

当增加了一行后，再点击这个新增的行，如何再新增一行......


简言之：无论点击页面的哪行（这一行包括 旧的和新增的)，都能在其下面新增1或多行。。。
-----------------------------------------------------------------------------

这个新增行的数据是从数据库中读取出来的,只想动态加载罢了。。

-------------------------------------------------------------------------





lovehongyun 2008-12-22
  • 打赏
  • 举报
 回复
看看吧.思路通过我发的这两个例子,已经提供给你了.
你要学会遍通.
接下来就靠自己吧.


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



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



<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <title>Untitled Page</title>

    <script type="text/javascript">

    

    function AddRow(currentRow)

    {

        debugger

        var panel = document.getElementById('test');

        var tr = panel.insertRow(currentRow.rowIndex+1);

        tr.id = "row"+Math.random;

        tr.onclick = function(){AddRow(tr);};

        var cells = currentRow.cells.length;

        for(i = 0;i<cells;i++)

        {

            var td = tr.insertCell();

            td.innerHTML ='cell'+i;

        }        

    }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <table border="1" id="test"> 

        <tr onclick="AddRow(this)" id="ro1"> 

            <td > 

              1 

            </td> 

            <td > 

            == 

            </td>

        </tr> 



        <tr id="row2" onclick="AddRow(this)"> 

            <td > 

              2 

            </td> 

            <td >

             == 

            </td>

        </tr>      

        <tr id="ro3" onclick="AddRow(this)"> 

            <td > 

              3 

            </td> 

            <td >

             == 

            </td>

        </tr> 

    </table>

    </form>

</body>

</html>
lovehongyun 2008-12-22
  • 打赏
  • 举报
 回复
lz你是不是就想要.我点击当前行,就会在当前行的下一行增加一行?

是要这个效果吗?
Jack123 2008-12-22
  • 打赏
  • 举报
 回复
谢谢大家了，呵呵。

还是如题：
点击第1行，如何在第1行与第2行之间增加一行？
点击第2行，如何在第2行与第3行之间增加两行？
<table border="1" id="test">
<tr onclick="AddRow(this)" id="ro1">
<td >
Row1
</td>
<td > ==
</td>
</tr>

<tr id="row2" onclick="AddRow(this)">
<td >
Row2
</td>
<td > ==
</td>
</tr>
<tr id="ro3" onclick="AddRow(this)">
<td >
Row3
</td>
<td > ==
</td>
</tr>
</table>


现在可以在第1行与第2行之间增加一行了，

但是
（1）td.innerHTML ='d';==》如何显示成2列呢，目前只能显示成一列？
（2）在第1行与第2行之间增加一行后，如何在（现在的）第2行与（现在的）第3行之间再增加一或两行呢？==》

（现在的）第2行与（现在的）第3行 不是原来的第2行与第3 行了...




lovehongyun 2008-12-22
  • 打赏
  • 举报
 回复 


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



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



<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <title>Untitled Page</title>

    <script type="text/javascript">

    

    function AddRow(currentRow)

    {

        var panel = document.getElementById('test');

        var tr = panel.insertRow(currentRow.rowIndex+1);

        var td = tr.insertCell();

        td.innerHTML ='d';

        

    }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <table border="1" id="test"> 

        <tr onclick="AddRow(this)" id="ro1"> 

            <td > 

              Row1 

            </td> 

        </tr> 



        <tr id="row2" onclick="AddRow(this)"> 

            <td > 

              Row2 

            </td> 

        </tr>      

        <tr id="ro3" onclick="AddRow(this)"> 

            <td > 

              Row3 

            </td> 

        </tr> 

    </table>

    </form>

</body>

</html>
lovehongyun 2008-12-22
  • 打赏
  • 举报
 回复
如果用js脚本做,很容易的.



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



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



<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <title>Untitled Page</title>

    <script type="text/javascript">

    

    function AddRow(currentRow)

    {

        var panel = document.getElementById('test');

        var tr = panel.insertRow(currentRow.rowIndex+1);

        var td = tr.insertCell();

        td.innerHTML ='d';

        

    }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <table border="1" id="test"> 

        <tr onclick="AddRow(this)" id="ro1"> 

            <td > 

              Row1 

            </td> 

        </tr> 



        <tr id="row2" onclick="AddRow(this)"> 

            <td > 

              Row2 

            </td> 

        </tr>      

        <tr id="ro3" onclick="AddRow(this)"> 

            <td > 

              Row3 

            </td> 

        </tr> 

    </table>

    </form>

</body>

</html>
在ASP.NET 2.0中操作数据之三十一：使用DataList来一行显示多条记录
ASP.NET 2.0中DataList默认情况使用单列多行的table来显示项，本文介绍通过设置RepeatColumns属性为每行的列数就可以达到显示多条记录这个目的。
循环获取多行table值.rar
可实现跨行获取（一列对多行），可直接运行
ASP.NET Core 基础 部署至Linux
该课程是胡延亮老师完成了相关《ASP.NET MVC》课程后，一套全新的课程，该课程围绕微软**的ASP.NET Core 开源和跨平台技术展开讲解，主要为从ASP.NET开发向ASP.NET Core跨平台开发提供帮助。本课程主要围绕ASP.NET ...
.NET社区

62,074

社区成员

669,028

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见，支持健康理性的辩论和互动，反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧

+ 用AI写文章