2012-04-19 10 views
0

私はこの質問に対する回答を広範囲に検索しましたが、何も見つかりませんでした。htmlテーブルの入力値をmysqlデータベーステーブルに追加

phpとjavascriptを使用して、各行が新しいレコードである、htmlテーブルの内容をmysqlデータベースに追加したいとします。

<table width="100%" border="1" cellspacing="0" cellpadding="0"> 
    <tr> 
    <th scope="col">ID</th> 
    <th scope="col">NAME</th> 
    <th scope="col">EMAIL</th> 

    </tr> 
    <tr id="row"> 
    <td><input name="ID" type="text" value="20" /></td> 
    <td><input name="NAME" type="text" value="Peter" /></td> 
    <td><input name="EMAIL" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row"> 
    <td><input name="ID" type="text" value="21" /></td> 
    <td><input name="NAME" type="text" value="Jhon" /></td> 
    <td><input name="EMAIL" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row"> 
    <td><input name="ID" type="text" value="22" /></td> 
    <td><input name="NAME" type="text" value="Mike" /></td> 
    <td><input name="EMAIL" type="text" value="[email protected]" /></td> 
    </tr> 
</table> 

<input name="Btn" type="button" onclick="addRecords()" value="Add"/> 
</form> 

そして、私が試したもののjavascriptのサンプル:ここ

がテーブルの一例である以上は何

<script> 
function addRecords() 
{ 
    var row = document.getElementById("row") 


    for (x in row) 
    { 
     $.post="<? $insertSQL = sprintf("INSERT INTO accounts (acc_id, acc_name, acc_email) VALUES (%s, %s)", 
         GetSQLValueString($_POST['ID'], "integer"), 
         GetSQLValueString($_POST['NAME'], "text"), 
         GetSQLValueString($_POST['EMAIL'], "text")); 

    mysql_select_db($database_G3CSAdminControlPanel, $G3CSAdminControlPanel); 
    $Result1 = mysql_query($insertSQL, $G3CSAdminControlPanel) or die(mysql_error()); ?>" 
    } 
} 

</script> 

、それだけで最後のレコードを追加しますテーブルをデータベースに追加します。 私の問題はPHPコードであると推測しており、各入力は配列だけでなく行だけでなく、どのように行うべきかもわかりません。

更新 返信いただきありがとうございます。私が示したコードは、私がやろうとしていることの一例に過ぎません。私の実際のWebページにテーブルを作成するスクリプトを使用しているため、行のIDは同じままでなければなりません。

基本的に私は、次の操作を実行したいのですが、PHPで:

<script> 
function addRecords() 
{ 
    var row = document.getElementById("row"); 
    var n = 0; 
    var q = 0; 
    for (x in "row") 
    { 
     n++; 
     var code = document.getElementsByName("ID")[q].value; 
     var desc = document.getElementsByName("NAME")[q].value; 
     var price = document.getElementsByName("EMAIL")[q].value; 
     alert(code + ' ' + desc + ' ' + price); 
     q++; 
    } 
    alert('There is ' + n + ' rows in the table'); 
} 
</script> 

スクリプトは、各行の入力の値を返します。 私はPHPで同様のことをしたいが、各行の入力からの値をデータベーステーブルのレコードとして追加する。

したがって、各行に対してjavascript警告を表示する代わりに、その行のレコードを挿入するPHPスクリプトを実行する必要があります。

+0

あなたはAJAXメソッドを調べていますか?またはJQuery? – Elen

+0

JSはクライアント上で動作し、PHPはサーバ上で動作します。あなたがしようとしていることは、期間、動作しません。あなたは、AJAXまたは完全なラウンドトリップ伝統的なフォーム提出システムを使用する必要があります。 –

+0

AJAXとJQueryをチェックします。私は今、サーバー側のPHPは、クライアント側JSと混合することはできません実現します。 PHPでこれを行う方法を試してみましたが、PHPがやりとりしてHTMLの値や要素を返す方法はJSとまったく同じです:/ – ChrisRSA

答えて

0

各行(ID0、EMAIL0など)を一意に識別する必要があります。これは、PHPまたはスクリプトを使用してテーブルを構築するときに簡単に実行されます。 PHPのフォームコードで$ _GETにforeachを行い、それぞれを読み込みます。あなたが今それを持っている方法は、それぞれのID、EMAILなどは、前のものを上書きすることです。

0

挿入するフィールドは3つあります。そして、それぞれ数多くあります。したがって、入力フィールドの名前をhtml配列として使用する必要があります。それ以外の場合は、フォームの投稿時に、最後のフィールドは以前のフィールドを上書きします。次のように

具体的に話して、あなたのマークアップを編集します。

<table width="100%" border="1" cellspacing="0" cellpadding="0"> 
    <tr> 
    <th scope="col">ID</th> 
    <th scope="col">NAME</th> 
    <th scope="col">EMAIL</th> 
    </tr> 
    <tr id="row1"> 
    <td><input name="ID[]" type="text" value="22" /></td> 
    <td><input name="NAME[]" type="text" value="Mike" /></td> 
    <td><input name="EMAIL[]" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row2"> 
    <td><input name="ID[]" type="text" value="22" /></td> 
    <td><input name="NAME[]" type="text" value="Mike" /></td> 
    <td><input name="EMAIL[]" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row3"> 
    <td><input name="ID[]" type="text" value="22" /></td> 
    <td><input name="NAME[]" type="text" value="Mike" /></td> 
    <td><input name="EMAIL[]" type="text" value="[email protected]" /></td> 
    </tr> 
</table> 
+0

ありがとう、これらの配列の使い方については、それが働いた。各行に一意の名前を割り当てる代わりに。私は各行のjavascriptによって増分される値を持つ非表示フィールドを作成しました。この値は、すべての配列値をループするために使用されます。 – ChrisRSA

0

をむしろ直接あなたの行にアクセスするよりも、まず、行をあなたのテーブルを取得します。

var table = document.getElementById('myTable'); 
for (i=1; i < table.rows.length; i++) { 
    var row = table.rows(i); 
} 
0

次のような同じIDを持つ複数の要素がある場合:

<tr id="row"> 

を、関数:

document.getElementById("row") 

は彼らの最後のものだけを検討します(これに応じてブラウザ)。

実際にすべての要素が得られることを確認するには、異なるIDを指定する必要があります。like

<tr id="row1">... 
... 
<tr id="row2">... 
... 
<tr id="row3">... 
... 

幸運!

関連する問題