1

こんにちは、jquery で ajax post と json を使用して、php からデータベース出力を読み取ります。ボタンをもう一度押すと、データ onClick を取得すると、その下にデータが再び入力されます。代わりにデータを新しいコンテンツに置き換えたい。私はjqueryとajaxに少し慣れていません。私が使用しているコードは次のとおりです。

    $.ajax({
type:'POST',
dataType: 'json',
url:'database.php',
data:{search: $("#search").val()},
success:function(rows){
    for (var i = 0, len = rows.length; i < len; i++) {
        $('#output').html($('#output').html() + '<tr><td>'+ rows[i].Cat_Name +'</td><td>'+ rows[i].Drug_Caty +'</td><td>'+ rows[i].G_Name +'</td><td>'+ rows[i].B_Name +'</td><td>'+ rows[i].D_Indications +'</td></tr>'        
        );
});
4

3 に答える 3

1

empty()メソッドを使用append()してから新しいデータを使用できます。次のことを試してください。

success:function(rows){
    $('#output').empty(); // Removes all child nodes of the set of matched elements from the DOM.
    for (var i = 0, len = rows.length; i < len; i++) {
        $('#output').append('<tr><td>'+ rows[i].Cat_Name +'</td><td>'+ rows[i].Drug_Caty +'</td><td>'+ rows[i].G_Name +'</td><td>'+ rows[i].B_Name +'</td><td>'+ rows[i].D_Indications +'</td></tr>'        
    };
}
于 2012-07-19T05:40:05.310 に答える
0

が aoutputの id であると仮定すると、<tbody><table>

次に、これを試してください

$("#output").html("");

for (var i = 0, len = rows.length; i < len; i++) {
        $('#output').html('<tr class="ajaxloaded"><td>'+ rows[i].Cat_Name +'</td><td>'+ rows[i].Drug_Caty +'</td><td>'+ rows[i].G_Name +'</td><td>'+ rows[i].B_Name +'</td><td>'+ rows[i].D_Indications +'</td></tr>');
        }
    }

それ以外の場合は、それ自体outputのID<table>

次に、これを試してください

$("#output tbody").html("");


for (var i = 0, len = rows.length; i < len; i++) {
        $('#output').html('<tr class="ajaxloaded"><td>'+ rows[i].Cat_Name +'</td><td>'+ rows[i].Drug_Caty +'</td><td>'+ rows[i].G_Name +'</td><td>'+ rows[i].B_Name +'</td><td>'+ rows[i].D_Indications +'</td></tr>');
        }
    }

PS テーブルの見出しを保持するには、<thead>タグ内に配置する必要があります

于 2012-07-19T05:54:48.233 に答える
0

あなたがやっている

output.html = output.html + x;

doing it 3 times will produce

(((output.html + x) + y) + z)

あなたがやろうとしているのは

output.html = x;

Ajax で読み込まれたコンテンツのみを置き換え、他の行はそのままにしておく場合:

success:function(rows){
    if($('.ajaxloaded').length)$('.ajaxloaded').remove();
    for (var i = 0, len = rows.length; i < len; i++) {
        $('#output').html('<tr class="ajaxloaded"><td>'+ rows[i].Cat_Name +'</td><td>'+ rows[i].Drug_Caty +'</td><td>'+ rows[i].G_Name +'</td><td>'+ rows[i].B_Name +'</td><td>'+ rows[i].D_Indications +'</td></tr>');
        }
    }

#output が table の場合は、@SangeethMenon が tbody を提案していることも確認してください

于 2012-07-19T05:41:05.297 に答える