如何动态添加表格行，并在后台代码中控制添加的状态状态

warden325 2010-12-11 10:40:29

对于第一个问题，尝试用js的cloneNode，但发现一个问题，页面的任何一个autopostback都会把之前添加的行删除，有无办法做到部分刷新？
对于第二个问题，表格中有个按钮，在页面的某些状态下该按钮必须置为无效状态，如果是input的HTML控件，如何控制它的readonly？如果换为asp:button则每次点击后都会出现上面第一个问题，即新增的表格行被删除。
已经折腾两天了，求帮忙>_<

...全文

468 24 打赏收藏转发到动态举报

写回复

用AI写文章

24 条回复

切换为时间正序

请发表友善的回复…

发表回复

打光棍的程序员 2011-09-05

打赏
举报

撒旦撒旦

koukoujiayi 2010-12-13

打赏
举报

兄弟,你18楼问题看不太懂!
把来龙去脉要说清楚!!

warden325 2010-12-13

打赏
举报

额……搞定了似乎，只是把下拉框中的语句改为

ClientScript.RegisterStartupScript(ClientScript.GetType(), "", "addRetValid(\"" + m_bAddRet.ToString() + "\")", true);

但还是不知道为什么>_<

遥望那些年 2010-12-12

打赏
举报

并在前台添加asp的table控件



<asp:Table ID="Table1" runat="server" />

遥望那些年 2010-12-12

打赏
举报



        Table table1 = new Table();

        TableRow r = new TableRow();

        TableCell c = new TableCell();



        r.Cells.Add(c);

        table1.Rows.Add(r);

koukoujiayi 2010-12-12

打赏
举报

allInputs[i].Disabled
大写改成小写
allInputs[i].disabled

warden325 2010-12-12

打赏
举报

似乎有点看懂了，我试下＾＾谢谢楼上几位……可以的话马上回来结贴……

warden325 2010-12-12

打赏
举报

function addRetValid(bValid)

        {

            var allInputs = document.getElementById("RetMsisdnTab").getElementsByTagName("input");

            alert(allInputs.length + "," + bValid);

            for (var i = 0; i < allInputs.length; i++)

            {

                alert(allInputs[i].type);

                if (bValid == "True" && allInputs[i].type == "button")

                {

                    allInputs[i].Disabled = "";

                }

                else if (bValid == "False" && allInputs[i].type == "button")

                {

                    allInputs[i].Disabled = "disabled";

                    alert(allInputs[i].Disabled);

                }

            }

        }

显示出来的确是disabled，不过似乎依然无效……不理解其中的道理真成问题啊……

koukoujiayi 2010-12-12

打赏
举报

bool a=true;
传递为True
所以应为bValid == "True"

warden325 2010-12-12

打赏
举报

修改了下，发现依然没用……

function addRetValid(bValid)

        {

            var allInputs = document.getElementById("RetMsisdnTab").getElementsByTagName("input");

            alert(allInputs.length);

            for (var i = 0; i < allInputs.length; i++)

            {

                if (bValid == "true" && allInputs[i].type == "button")

                {

                    allInputs[i].ReadOnly = false;

                }

                else if (bValid == "false" && allInputs[i].type == "button")

                {

                    allInputs[i].ReadOnly = true;

                }

            }

        }

koukoujiayi 2010-12-12

打赏
举报

调用的JS函数,应放在<head>之间

koukoujiayi 2010-12-12

打赏
举报

传递非数值参数应加单引号!
Page.ClientScript.RegisterStartupScript(Page.GetType(), "", "addRetValid('" + m_bAddRet + "')", true);

js接受判断,由于是字符串了,所以
if (bValid)
应改为
if (bValid=="True")

warden325 2010-12-12

打赏
举报

我不知道上面那段是用法出了问题还是js脚本有问题，但在页面加载时并没alert，怀疑没调用这个js函数……
P.S：这个JS函数我放在了body里了>_<

warden325 2010-12-12

打赏
举报

额……正因为不懂所以才需要上CSDN求大家帮忙……任何人不可能一开始就是一个大鸟，我想包括楼上的吧>_<……希望楼上的大虾能帮小弟指明下方向呵……

以专业开发人员为伍 2010-12-12

打赏
举报

随便折腾！

有些人既不懂asp.net控件编程，也不懂抛开所有asp.net机制自己开发一套javascreipt框架，在中间状态混日子，我看能做什么应用程序框架出来？！

warden325 2010-12-12

打赏
举报

奇怪了，在下拉框的事件中修改m_bAddRet的值，却依然传了个False进去……



protected void Page_Load(object sender, EventArgs e)

    ｛

        Response.Write("<script language='javascript'>alert('PageLoad" + m_bAddRet.ToString() + "');</script>");

        Page.ClientScript.RegisterStartupScript(Page.GetType(), "", "addRetValid(\"" + m_bAddRet.ToString() + "\")", true);

    }



protected void TypeDropDownList_SelectedIndexChanged(object sender, EventArgs e)

    {

        //ReFillProgDropList(TypeDropDownList, ProgDropDownList);

        m_bAddRet = true;

        Response.Write("<script language='javascript'>alert('SelectChange" + m_bAddRet.ToString() + "');</script>");

        Page.ClientScript.RegisterStartupScript(Page.GetType(), "", "addRetValid(\"" + m_bAddRet.ToString() + "\")", true);

    }

function addRetValid(bValid)

        {

            var allInputs = document.getElementById("RetMsisdnTab").getElementsByTagName("input");

            alert(bValid);

            for (var i = 0; i < allInputs.length; i++)

            {

                if (bValid == "True" && allInputs[i].type == "button")

                {

                    allInputs[i].disabled = "";

                }

                else if (bValid == "False" && allInputs[i].type == "button")

                {

                    allInputs[i].disabled = "disabled";

                }

            }

        }

在下拉框更改后，alert的顺序是PageLoadFalse;SelectChangeTrue;False;
不理解为什么传给addRetValid的是False而不是True

wwfgu00ing 2010-12-12

打赏
举报

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

<head runat="server">

  <title>无标题页</title>



  <script language="javascript" type="text/javascript">



  //使用clone方式来生成一行，targetTable是需要添加行的table的ID，sourceTable是clone对象



  //talbe的ID，即复制sourceTable的第一行插入到targetTable中，完成增加行的操作



  function insertRow(targetTable,sourceTable)



  {



  var oTBODY = document.getElementById(targetTable).tBodies.item(0);



  var oTBODYData = document.getElementById(sourceTable).tBodies.item(0);



  var rowsCount = oTBODYData.rows.length;



  for(var i=0;i<rowsCount;i++){



  oTBODY.appendChild(oTBODYData.rows[i].cloneNode(true));



  }



  }



    



  function deleteRow(Field,targetTable){



  var findex = getElementOrder(Field)-1;//此处减1是因sourceTable中有一行是隐藏的



  document.getElementById(targetTable).deleteRow(findex);



  }



    



  // 查询出将要删除的行所在的位置index



  function getElementOrder(field){



  var i = 0;



  var order = 0;



  var elements = document.getElementsByName(field.name);



  for(i=0;i<elements.length;i++){



  order++;



  if(elements[i]==field){



  break;



  }



  }



  return order;



  }



  </script>



</head>

<body>

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

  <div>

  <table id="sourceTable" style="display: none;">

  <tr>

  <td>

  <input type="text" name="username">

  </td>

  <td>

  <input type="password" name="password">

  </td>

  <td>

  <input type="text" name="age">

  </td>

  <td>

  <input type="button" name="deleteButton" value="删除" onclick="deleteRow(this,'targetTable')">

  </td>

  </tr>

  </table>

  <table id="targetTable">

  <tr>

  <td>

  用户名

  </td>

  <td>

  密码

  </td>

  <td>

  年龄

  </td>

  <td>

   

  </td>

  </tr>

  <tfoot>

  <tr>

  <td colspan="4" align="right">

  <input type="button" value="增加行" onclick="insertRow('targetTable','sourceTable');">

  </td>

  </tr>

  </tfoot>

  </table>

  </div>

  </form>

</body>

</html>

warden325 2010-12-12

打赏
举报

[Quote=引用 4 楼 koukoujiayi 的回复:]

如原有table有三列,如下:
HTML code
<table id="tb" border="1" width="400">
<tr>
<td></td><td></td><td></td>
</tr>
</table>

点Button加一行,如下:
……
[/Quote]
试了下，似乎Page.ClientScript.RegisterStartupScript没发挥作用？

function addRetValid(bValid)

        {

            var allInputs = document.getElementById("RetMsisdnTab").getElementsByTagName("input");

            alert(allInputs.length);

            for (var i = 0; i < allInputs.length; i++)

            {

                if (bValid)

                {

                    allInputs[i].ReadOnly = false;

                }

                else

                {

                    allInputs[i].ReadOnly = true;

                }

            }

        }

<table id="RetMsisdnTab" cellpadding="0" cellspacing="1" border="0" width="320" bgcolor="#CCCC99">

                                    <tr class="input">

                                        <td class="style6"><asp:TextBox ID="RetMsisdnTextBox" runat="server"></asp:TextBox></td>

                                        <td><asp:TextBox ID="RetPercentTextBox" runat="server" Width="50px"></asp:TextBox>

                                            <asp:Label ID="PerLabel" runat="server" Text="%"></asp:Label></td>

                                        <td style="width:52px"><input type="button" value="添 加" class="btn" onClick="insRow()" /></td>

                                    </tr>

                                </table>

然后在PageLoad中添加下面这句（m_bAddRet=false）：

Page.ClientScript.RegisterStartupScript(Page.GetType(), "", "addRetValid(" + m_bAddRet.ToString() + ")", true);

试了下，刚进入页面的时候，那个按钮依然有效>_<

koukoujiayi 2010-12-11

打赏
举报

如原有table有三列,如下:

        <table id="tb"  border="1" width="400">

            <tr>

                <td></td><td></td><td></td>

            </tr>

         </table>



         点Button加一行,如下:

         <input id="Button1" type="button" value="button" onclick="addline(1,0)" />



         加一个隐藏域用来记录添加的行数,用于回发恢复

          <input id="Hidden1" type="hidden" runat="server" />

js:

    <script type="text/javascript">

        function addline(trCount,flag) {

            var tb=document.getElementById("tb");

            var tr = document.createElement("tr");

            var td = document.createElement("td");

            td.height = 20;

            for (i = 0; i < 3; i++) {

                tr.appendChild(td.cloneNode(true));

            }

            for (i = 0; i < trCount; i++) {

                tb.appendChild(tr.cloneNode(true));

            }



            if (flag == 0) {

                if (document.getElementById("Hidden1").value == "")

                    document.getElementById("Hidden1").value = "1";

                else

                    document.getElementById("Hidden1").value = parseInt(document.getElementById("Hidden1").value) + 1;

            }

        }

    </script>

    protected void Page_Load(object sender, EventArgs e)

    {

        Page.ClientScript.RegisterStartupScript(Page.GetType(), "", "addline(" + Hidden1.Value + ",1)", true);

    }

至于表格中有个按钮处理道理是一样的

warden325 2010-12-11

打赏
举报

[Quote=引用 1 楼 wuyq11 的回复:]

将新增的标签的name 赋给已知的标签
例如 hidden.value
通过HIdden，request.form取值
[/Quote]
额……我不是很清楚，新增的TextBox每次autopostback都会自动丢失，把新增TextBox的ID传给标签么？
js我参考之前csdn的脚本写了一段……