1

これは私のコードです。追加ボタンをクリックすると、新しいテキストフィールドが表示されますが、ページ全体が更新され、既存のデータも更新されます。助けてください。

<?php       
    if( !isset( $_POST['j'] ) ) {
        static $j = 1;
    } else {
        //j is a reference for $i in the loop. $i will loop while it is less than $j.
        if( isset( $_POST['plus'] ) ) {
           $j = $_POST['j']+1; //by incrementing $j, $i will loop one more time.
        }
        if( isset( $_POST['minus'] ) ) {
           if( @$j < 1 ) { //if there is only one box the user can't remove it
               $j = $_POST['j']-1;
           }
        }   
    }
?>
<?php echo '<input type="hidden" name="j" value="' . @$j . '"/>' ?>
<?php for( $i = 0; $i < @$j; $i++ ) { ?>
    <input id="txt_id" name="txt_id[]"  type="text" value="" readonly="readonly"/> 
<? } ?>
<input type ="submit" value="+" name="plus">
<input type ="submit" value="-" name="minus">
4

3 に答える 3

2

これは、生成されるテキストフィールドの値を設定する必要があるためです。

forループを次のように置き換えてみてください。

<?php for( $i = 0; $i < @$j; $i++ ) { ?>
      <input id="txt_id" name="txt_id[]"  type="text" value="<?php echo $_POST['txt_id'][$i];?>" readonly="readonly" />
<? } ?>
于 2012-12-20T06:58:28.107 に答える
1

サーバーに実装されているコードを投稿しました。ローカルサーバーでこのコードを試してみてください。それは機能し、解決策を見つけるのに役立ちます。

<html>

    <head>
        <title> Add/Remove dynamic rows in HTML table </title>
        <script language="javascript">

            function addRow(tableID) {
                var numb = document.getElementById("numb").value;
                for($i=1;$i<=numb;$i++) {
                    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)[$i];

                    var cell2 = row.insertCell(1);
                    cell2.innerHTML = rowCount + 1;

                    var cell3 = row.insertCell(2);
                    var element2 = document.createElement("input");
                    element2.type = "text";
                    element2.name = "firstname["+rowCount+"]";
                    cell3.appendChild(element2)[$i];

                    var cell4 = row.insertCell(3);
                    var element3 = document.createElement("input");
                    element3.type = "text";
                    element3.name = "lastname["+rowCount+"]";
                    cell4.appendChild(element3)[$i];

                    var cell5 = row.insertCell(3);
                    var element4 = document.createElement("input");
                    element4.type = "text";
                    element4.name = "town["+rowCount+"]";
                    cell5.appendChild(element4)[$i];

                    var cell6 = row.insertCell(3);
                    var element5 = document.createElement("input");
                    element5.type = "text";
                    element5.name = "state["+rowCount+"]";
                    cell6.appendChild(element5)[$i];
                }

            }
        </script>
    </head>
    <body>
     <form action="#" method="post">
        <input type="button" value="Add Row" onclick="addRow('dataTable')" />
        <input type="text" name="numb" id="numb" value="" />
        <input type="submit" name="submit" value="submit" />
        <table id="dataTable" width="350px" border="1">

        </table>
        </form>
    </body>
    </html>
于 2012-12-20T07:25:24.173 に答える
0

http://viralpatel.net/blogs/dynamic-add-textbox-input-button-radio-element-html-javascript/

http://jpsolution.wordpress.com/tag/add-text-box-dynamically-javascript/

これらのサイトが役立つことを願っています

于 2012-12-20T09:58:37.800 に答える