2016-11-27 72 views
0

我想通过向我的服务发出GET请求来“搜索”一个项目,然后用响应填充我的表,但我似乎无法用我的代码实现该目标。用jquery填充空表

$(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>'); 
     }); 
     }   
     }); 
    }); 
    } 
}); 
}); 
+0

* “我似乎无法做到这一点” * - 护理阐述? – jbutler483

+0

@ jbutler483当项目已经被获得时,表格消失,它只是一个空的空间。 – kennyYice23

+0

在您的inspect元素中检查您的网络,看看是否有任何东西从服务器返回 – jbutler483

回答

0

jbutler483是正确的,你与你的$杀死整个表,THEAD,TBODY,(一切)( “#orderTable”)空()。声明。

你的追加针对的东西不存在。试试这个:

$(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>'); 
 
     }); 
 
     }   
 
     }); 
 
    }); 
 
    } 
 
}); 
 
});