0

JQuery load() からテーブルにデータを追加しようとしています。データをテーブルに正常に追加できますが、追加された結果はテーブルの残りの部分に合わせてフォーマットされません。

テーブルの現在の形式（追加後）

+---------------------------------------------------+
|                    Data                           |
-----------------------------------------------------
|    Data                |            Data          |
-----------------------------------------------------
|    Data                |            Data          |
-----------------------------------------------------
|Append data|Append data |
--------------------------
|Append data|Append data |
--------------------------
|Append data|Append data |
--------------------------
|Append data|Append data |
--------------------------

ご希望のフォーマット

+---------------------------------------------------+
|                    Data                           |
-----------------------------------------------------
|    Data                |            Data          |
-----------------------------------------------------
|    Data                |            Data          |
-----------------------------------------------------
|      Append Data       |        Append Data       |
 -----------------------------------------------------
|      Append Data       |        Append Data       |
-----------------------------------------------------
|      Append Data       |        Append Data       |
-----------------------------------------------------

コードの抜粋:

    <table id="edititemtable" border='1'>

<tr>
    <td colspan='2'>Item Info</td>
</tr>

<tr>
    <td>Select Category: </td>
    <td>
        <select id='changeitemcat' name='changeitemcat'></select>
    </td>
</tr>

<tr>
    <td>Select SubCategory: </td>
    <td>
        <select id='changeitemsubcat' name='changeitemsubcat'></select>
    </td>
</tr>

<div id="details" name="details">
</div>

</table>

使用したjQueryの抜粋

$("#edititemtable").append($("#details").load('changeitem.php?cat='+cat+'&subcat='+subcat+'&item='+item));

.load() ファイルの抜粋

while($extractdetails=$getitem->fetch(PDO::FETCH_ASSOC))
{
//Data is saved into the associated variables


echo"<tr>";
    echo"<td>";
        echo"Item Name";
    echo"</td>";
    echo"<td>";
        echo"<input type='text' id='changeitemname' name='changeitemname' value=$itemname size='30' maxlength='50' />";
    echo"</td>";
echo"</tr>";    

echo"<tr>";
    echo"<td>";
        echo"Item Price";
    echo"</td>";
    echo"<td>";
        echo"<input type='text' id='changeitemprice' name='changeitemprice' value=$itemprice size='7' maxlength='7' />";
    echo"</td>";
echo"</tr>";

echo"<tr>";
    echo"<td>";
        echo"Item Info";
    echo"</td>";
    echo"<td>";
        echo"<textarea class='textarea' id='changeiteminfo' name='changeiteminfo' col='10' rows='10' maxlength='300' >$iteminfo</textarea>";
    echo"</td>";
echo"</tr>";


echo"<tr>";
    echo"<td>";
        echo'<form id="changeitem" name="changeitem" method="POST" action="">';
            echo"<input type='hidden' id='changeitemid' name='changeitemid' value='$itemid' />";
            echo"<input type='submit' id='changeitemsubmit' name='changeitemsubmit' value='Save Changes' />";
        echo"</form>";
    echo"</td>";
echo"</tr>";

}

質問

目的のフォーマットを取得するにはどうすればよいですか?

追加されたデータが の 1 つに強制されるのはなぜですか?

解決：

<table id="edititemtable" border='1'>

<tr>
    <td colspan='2'>Item Info</td>
</tr>

<tr>
    <td>Select Category: </td>
    <td>
        <select id='changeitemcat' name='changeitemcat'></select>
    </td>
</tr>

<tr>
    <td>Select SubCategory: </td>
    <td>
        <select id='changeitemsubcat' name='changeitemsubcat'></select>
    </td>
</tr>

<tr>
    <td colspan="2" id="details" name="details">
    </td>
</tr>

</table>

Ps 現在 HTML 5 と PHP を使用しています

4

2 に答える 2

1

a を a の<div>中に入れること<table>は有効ではありません ( a<tr>との中にない場合<td>)。そのため、これを行おうとすると、(あなたに関する限り)「正しくない」結果が表示されます。最も簡単な解決策は、それを a<div>から要素に変更することです。これは、要素内にあり、テーブル行を含む<tbody>ことが完全に有効です。<table>

<table id="edititemtable" border="1">
    <tr>
        <td colspan="2">Item Info</td>
    </tr>
    <tr>
        <td>Select Category:</td>
        <td>
            <select id="changeitemcat" name="changeitemcat"></select>
        </td>
    </tr>
    <tr>
        <td>Select SubCategory:</td>
        <td>
            <select id="changeitemsubcat" name="changeitemsubcat"></select>
        </td>
    </tr>
    <tbody id="details"></tbody>
</table>

.append()その要素はすでにテーブルの最後にあるため、呼び出す必要もありません。ただ行う：

$('#details').load('changeitem.php?cat='+cat+'&subcat='+subcat+'&item='+item);
于 2013-09-02T14:31:42.847 に答える