4

動的テーブルを作成するスクリプトがあります。ユーザーがボタンをクリックするrowと、テーブルの一番下に次が追加されます。

function createRow()
        {
            var options='<select name="nameselect'>
            options+='<option>one</option>';
            options+='</select>';
        options+='<input type=\'submit\' name=\'loadReq\' value=\'Pobierz dane\' />';
            var form = document.createElement('form'); // create row node
            var row = document.createElement('tr'); // create row node
            var col = document.createElement('td'); // create column node
            var col2 = document.createElement('td'); // create second column node
            var col3 = document.createElement('td'); // create column node
            var col4 = document.createElement('td'); // create second column node
            var col5 = document.createElement('td'); // create column node
            var col6 = document.createElement('td');
            form.appendChild(col);
            row.appendChild(form); // append first column to row
            row.appendChild(col2); // append second column to row
            row.appendChild(col3); // append first column to row
            row.appendChild(col4); // append second column to row
            row.appendChild(col5); // append first column to row
            //row.appendChild(col6);
            col.innerHTML = options; 

            col2.innerHTML = 'some text'; // put data in second column
            col3.innerHTML = 'some text';
            col4.innerHTML = 'some text';           
            col5.innerHTML = 'some text';
            table.insertAdjacentElement('beforeEnd', row);
            counter++;
        }

some textしたがって、現在、2〜5列に値がありdrop down list、最初の列にフォームとしてボタンがある行を追加しています。



しかし、フォームを送信するたびにページがリロードされるため、JavaScript機能の効果がなくなり、以前に開いたページとまったく同じページが表示され、追加した行が消えます。

機能を損なわずにフォームを送信することはできJavaScriptますか？

4

5 に答える 5

1

AJAX を使用してフォームを送信することを検討できます: http://www.malsup.com/jquery/form/

このようにして、フォーム内のデータを使用していくつかのアクションを実行し、ページ全体の更新をトリガーすることなくユーザーにフィードバックを提供できます。

于 2013-03-28T08:39:34.167 に答える
1

PHP/Javascript のすべての可能性に少し戸惑っていると思います。

ユーザーに表示しているものを更新するために、ユーザーがフォームに入力したデータを使用したい場合でも、フォームを送信する必要はありません。Javascriptを使用して（ページをリロードせずに）実行できます：

var userInput = document.getElementById('userInput').value;

PHPでユーザー入力を取得して使用するためにフォームを送信する場合（たとえば、データベースを更新するため...）、フォームを送信し、再表示するときに（ページのリロード後）、次のように初期化します以前のユーザー入力。そのようなことをする：

echo '<input type="text" name="userInput" value="'.$_POST['userInput'].'">';
于 2013-03-28T09:21:17.073 に答える
0

ボタン クリックのデフォルトの動作をキャンセルするか、これを から または に変更します<input type="submit">(<input type="button">両方<button>ともデフォルトの動作はありません)。

于 2013-03-28T08:40:17.920 に答える
0

フォームの送信時に呼び出される関数に追加return false;すると、フォームの送信が妨げられます。

function createRow(){
    /*Code*/
    return false;
}
于 2013-03-28T08:40:34.867 に答える
0 
    table.insertAdjacentElement('beforeEnd', row);
    counter++;
    return false;
}

エクストラreturn false;は、通常のようにフォームが送信されないようにします。

于 2013-03-28T08:40:44.587 に答える