如何使用Java脚本在asp.net中单击按钮时生成动态行 [英] How to generate dynamic rows while clicking on a button, in asp.net with java script

问题描述

如何使用Java脚本动态地生成包含文本框和下拉列表的动态行，该行使用服务器来请求服务器请求，该页面继承了母版页.

how to generate dynamc rows which contains textboxes and dropdownlists dynamically whih out going for server request, using java script, this page which inherits masterpage.

推荐答案

这是工作中....

This is working....

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<SCRIPT language="javascript">
    function addRow(tableID) {

        var table = document.getElementById(tableID);

        var rowCount = table.rows.length;
        var row = table.insertRow(rowCount);

        var colCount = table.rows[0].cells.length;

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

            var newcell = row.insertCell(i);

            newcell.innerHTML = table.rows[0].cells[i].innerHTML;

            alert("jka")

            switch (newcell.childNodes[0].type) {

                case "DropDownList":

                    alert("jkadrop")

                   // newcell.childNodes[0].Id = parseInt(substring(0, newcell.childNodes[0].Id.toString.length - 1)) + parseInt(substring(newcell.childNodes[0].Id.toString.length - 1, newcell.childNodes[0].Id.toString.length)) + 1;

                    alert(parseInt(substring(0, newcell.childNodes[0].Id.toString.length - 1)));

                    //alert(newcell.childNodes[0].Id.toString);

                    newcell.childNodes[0].value = "";

                    break;

                case "TextBox":

                    alert("jkatext")

                    newcell.childNodes[0].Id = i + 1;

                    newcell.childNodes[0].value = "";

                    break;

                case "checkbox":

                    alert("jkachek")

                    newcell.childNodes[0].Id = i + 1;

                    newcell.childNodes[0].checked = false;

                    break;

            }

        }

    }



    function deleteRow(tableID) {

        try {

            var table = document.getElementById(tableID);

            var rowCount = table.rows.length;



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

                var row = table.rows[i];

                var chkbox = row.cells[0].childNodes[0];

                if (null != chkbox && true == chkbox.checked) {

                    if (rowCount <= 1) {

                        alert("Cannot delete all the rows.");

                        break;

                    }

                    table.deleteRow(i);

                    rowCount--;

                    i--;

                }



            }

        } catch (e) {

            alert(e);

        }

    }



    </SCRIPT>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />

    <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /><asp:Button

        ID="btnSubmit" runat="server" onclick="btnSubmit_Click" Text="Submit" />
&nbsp;<TABLE id="dataTable" width="350px" border="1">
        <TR>
            <TD><INPUT type="checkbox" name="chk"/></TD>
            <TD>
                <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            </TD>
            <TD>
                <asp:DropDownList ID="DropDownList1" runat="server">
                    <asp:ListItem>2 wheeler</asp:ListItem>
                    <asp:ListItem>4 Wheeler</asp:ListItem>
                </asp:DropDownList>
            </TD>
            <TD>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            </TD>
        </TR>
    </TABLE>
</asp:Content>

http://blogs.msdn.com/b/jjameson/archive/2010/04/28/custom-table-headers-with-the-asp-net-gridview-control.aspx[^]

这篇关于如何使用Java脚本在asp.net中单击按钮时生成动态行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！