1

我的目的是在动态字段中创建动态文本框和组合框（该字段包括两个文件上传和一个添加动态文本框和组合框的按钮）。一切正常，但是当我尝试删除动态 tb 和 cb 时，它只适用于第一个字段（并且不适用于下一个字段）。所以请帮我解决它！！！！以及如何将数据从数据库填充到动态组合框？？？

我有以下代码：

 <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title> 

<script type = "text/javascript">
    var counter = 2;
    function AddFileUpload() {
        var div = document.createElement('DIV');
        div.setAttribute("id", "FileUploadContainer");
        var nextcounter = counter + 1;

        var input1 = document.createElement("input");
        input1.setAttribute("id", "file" + counter);
        input1.setAttribute("name", "file" + counter);
        input1.setAttribute("type", "file");
        div.appendChild(input1);

        var input2 = document.createElement("input");
        input2.setAttribute("id", "file" + nextcounter);
        input2.setAttribute("name", "file" + nextcounter);
        input2.setAttribute("type", "file");
        div.appendChild(input2);

        var button = document.createElement("input");
        button.setAttribute("id", "remove");
        button.setAttribute("type", "button");
        button.setAttribute("value", "Remove");
        button.setAttribute("onclick", "RemoveFileUpload(this)");
        div.appendChild(button);

        var button1 = document.createElement("input");
        button1.setAttribute("id", "add");
        button1.setAttribute("type", "button");
        button1.setAttribute("value", "Add");
        button1.setAttribute("onclick", "AddCombobox(this)");
        div.appendChild(button1);

        document.getElementById("dynamicForm").appendChild(div);
        counter+=2;
    }
    function RemoveFileUpload(obj) {
        document.getElementById("dynamicForm").removeChild(obj.parentNode);
    }
</script>
<script type = "text/javascript">
    var cbcounter = 1;
    function AddCombobox(obj) {
        var div = document.createElement('DIV');
        div.setAttribute("id", "ComboboxContainer");

        var select = document.createElement("select");
        select.setAttribute("name", "sl" + cbcounter);
        select.setAttribute("runat", "server");

        var option1 = document.createElement("option");
        var text = document.createTextNode(cbcounter.toString());
        option1.appendChild(text);
        select.appendChild(option1);

        var option2 = document.createElement("option");
        text = document.createTextNode((cbcounter + 1).toString());
        option2.appendChild(text);
        select.appendChild(option2);
        div.appendChild(select);

        var textbox = document.createElement("input")
        textbox.setAttribute("name", "txt" + cbcounter);
        textbox.setAttribute("type", "text");
        div.appendChild(textbox);

        var button = document.createElement("input");
        button.setAttribute("id", "removecb");
        button.setAttribute("type", "button");        
        button.setAttribute("onclick", "RemoveCombobox(this)");
        div.appendChild(button);

        obj.parentNode.appendChild(div);
        cbcounter++;
    }
    function RemoveCombobox(obj) {
        document.getElementById("FileUploadContainer").removeChild(obj.parentNode);
    }
</script>

</head>
<body>
    <form id="form1" runat="server" enctype="multipart/form-data" method = "post">

        <span style ="font-family:Arial">Click to add files</span>&nbsp;&nbsp;

        <input id="Button1" type="button" value="add field" onclick = "AddFileUpload()" />
        <br /><br />

        <div id = "FileUploadContainer">

            <input id="file0" name = "file0" type="file" runat="server" />            
            <input id="file1" name = "file1" type="file" runat="server" />  
            <input id="addcb" type="button" value="add" onclick = "AddCombobox(this)" />         

            <div id="ComboboxContainer" runat="server"> 
                <select id="sl0" runat="server">
                    <option value="0"></option>
                    <option value="1"></option>
                </select> 
                <input type="text" name="txt0" value="txt0" />
            </div>

        </div>

        <br />

        <span id="dynamicForm">
        </span>                 

        <asp:Button ID="btnUpload" runat="server" Text="Upload" />
    </form>
</body>
</html>

我非常感谢您的帮助！！！

4

0 回答 0