Eine leere Tabelle mit jquery füllen

Question

Ich versuche, nach einem Element zu suchen, indem ich eine GET-Anfrage an meinen Dienst mache und dann meine Tabelle mit der Antwort bearbeite, aber das kann ich mit meinem Code nicht erreichen.

$(function(){ 
var $searchInput = $("#search"); 
$("#searchOptions").change(function(){ 
if($(this).val() =="Fragment"){ 
$searchInput.keyup(function(e){ 
var q = $searchInput.val(); 
$.ajax({ 
    type: 'GET', 
    url: 'http://localhost:51834/CoffeeService.svc/getaorderfrag/' + q, 

    success: function(orders){ 
    $("#orderTable").empty(); 
    $.each(orders, function(i, order){ 
     $("#orderTable tbody").append('<tr><td>' + order.Name + '</td><td>' + order.Order + '</td><td>' + order.Price + '</td></tr>'); 
     }); 
     }   
     }); 
    }); 
    } 
}); 
}); 

Answer 1

jbutler483 ist richtig, Sie sind die gesamte Tabelle zu töten, thead, tbody, (alles) mit $ ("# orderTable") empty(). Erklärung.

Ihr Append zielt auf etwas ab, das nicht existiert. Versuchen Sie folgendes:

$(function(){ 
 
var $searchInput = $("#search"); 
 
$("#searchOptions").change(function(){ 
 
if($(this).val() =="Fragment"){ 
 
$searchInput.keyup(function(e){ 
 
var q = $searchInput.val(); 
 
$.ajax({ 
 
    type: 'GET', 
 
    url: 'http://localhost:51834/CoffeeService.svc/getaorderfrag/' + q, 
 

 
    success: function(orders){ 
 
    $("#orderTable tbody").empty(); 
 
    $.each(orders, function(i, order){ 
 
     $("#orderTable tbody").append('<tr><td>' + order.Name + '</td><td>' + order.Order + '</td><td>' + order.Price + '</td></tr>'); 
 
     }); 
 
     }   
 
     }); 
 
    }); 
 
    } 
 
}); 
 
});