AppendChild表格/表格[Javascript / Html / PHP]

时间:2012-08-22 16:27:36

标签: javascript php html-table appendchild

我的主要问题是我有一个非常好的设置添加表单/删除它们的能力但问题是,做一种类型的追加将使输入显示(我正是我想要的)但实际上不是添加到表单中,而另一个使表单不可见但是您可以在$_POST上看到它。

<script language="javascript">
    function addRow(tableID,texting,values) {

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

        var cell1 = row.insertCell(0);
        var element1 = document.createElement("input");
        element1.type = "checkbox";
        cell1.appendChild(element1);

        var cell2 = row.insertCell(1);
        cell2.innerHTML = texting+":";

        var cell3 = row.insertCell(2);
        var element2 = document.createElement("input");
        element2.type = "text";
        element2.name = texting; // Change this dummy.
        if(tableID == "levelup")
            element2.name += "rate";
        if(values != "" && values != null && values != "undefined")
            element2.value = values;
        cell3.appendChild(element2); //This isn't hidden but no works, wat?
        //document.forms[1].appendChild(element2); //This works but is hidden
        //document.forms[1].write("hi!");

    }



    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) {
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }


            }
        }catch(e) {
            alert(e);
        }
    }
</script>
<html>
    <table>
        <tr><td>Add statistic:</td></tr>
        <form action="<?php echo $PHP_SELF; ?>" method="post" enctype="multipart/form-data"> 
            <tr><td><input type="text" name="addme"><input type="button" value="add" onclick="addRow('formulas',document.forms[0].addme.value); addRow('levelup',document.forms[0].addme.value,'1+'+document.forms[0].addme.value)"/></td><td><input type="button" value="Delete" onclick="deleteRow('formulas'); deleteRow('levelup')"/></td></tr>
        </form>
        <form action="<?php echo $PHP_SELF; ?>" method="post" enctype="multipart/form-data">  
            <tr><td>Formula name:</td><td><input type="text" name="formulaname"></td></tr>
            <tr><td>Statistics at level 1(required)</td></tr>
            <tr>
            <table>
                <tr><td>Level 1:</td></tr>
                <tr><td>Move speed:</td><td><input type="text" value="1" name="movespeed"></td></tr>
                <tr><td>Stats:</td></tr>
                <tr><td><table id="formulas"></table></td></tr>
            </table></tr>
            <tr><td>Level up Formula Rates</td></tr>
            <table>
                <tr><td>Move speed:</td><td><input type="text" value="Mov+1" name="Movrate"></td></tr>
                <tr><td>Experience:</td><td><input type="text" value="(Exp*0.25)*Exp*Lvl+(0.25*Mov)" name="Exprate"></td></tr>
                <tr><td><table id="levelup"></table></td></tr>
            </table>
            <tr><td><input type="submit"  value="Save"/></td></tr>
        </form>
    </table>
</html>

1 个答案:

答案 0 :(得分:0)

这不起作用,因为您在表单外附加了一个新行。将表拆分为两个单独的表,一个用于第一个表,另一个用于第二个表。然后将表包装在当前位于其中的表单标记中。

结果应具有以下结构:

<form>
  <table> (add statistics form) </table>
</form>
<form>
  <table> (formulas) </table>
</form>