1

AJAXを使用してデータベースに保存している2つのテキストボックスがあります。しかし、テーブル構造に新しく追加された行を戻したいです。

私はこの概念を販売する製品の追加に使用しています。アイテムを追加したいときは、表形式のグリッド形式で表示されます。

これは私の AJAX コードです。 

    var xmlHttp
    function newVendorGridInital()
    {
    //alert("HI");
    xmlHttp=GetXmlHttpObject()
    if (xmlHttp==null)
     {alert ("Browser does not support HTTP Request"); return } 

    var  item= document.getElementById('itemcode').value;
    var url="ajax_NewVendorGrid.php"
    url=url+"?itm="+item; // For multiple value send.

    url=url+"&sid="+Math.random()

    xmlHttp.onreadystatechange=newVendorGrid
    xmlHttp.open("GET",url,true)
    xmlHttp.send(null)
} 

function newVendorGrid() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 {
    document.getElementById("GridRuntimeData").innerHTML=xmlHttp.responseText;
           > > > I didn't understand how to target the id field > > > GridRuntimeData 
 } 
}

私のhtmlページでは、テーブル構造、つまりヘッド部分を作成しました。

私のPHPファイルでは、挿入された行全体をechoステートメントを使用してhtml行形式で返しています。 

    <?php   
     echo "<tr><td>".$item."</td></tr>";
    ?>

私の疑問は、その行を表に表示する方法です。テーブル構造全体を php コードで記述すると、正常に動作します。しかし、私は常に行全体を返すことはしたくありません。

私を助けてください。

4

1 に答える 1

1

次のように、Javascript を使用してテーブルに行を動的に追加できます。

    var table = document.getElementById("mytable");

    var td = document.createElement('td');
    td.innerHTML = 'new row';

    var tr = document.createElement('tr');
    tr.appendChild(td);

    table.appendChild(tr);

jsFiddle のデモはこちら

于 2012-11-02T12:27:02.097 に答える