2014-10-30 117 views
0

我有一個API控制器CustomerController返回客戶的數據:JQuery的Ajax調用ASP.NET MVC API返回錯誤

using System.Collections.Generic; 
using System.Linq; 
using System.Web.Http; 
using CustomerMngmt.Models; 

namespace CustomerMngmt.Controllers 
{ 
    public class CustomersController : ApiController 
    { 
     private readonly Customer[] _customer = 
    { 
     new Customer 
     { 
      Id = 1, 
      firstName = "Florian", 
      lastName = "Hofmeister", 
      emailAddress = "[email protected]", 
      company = "Germany", 
      pictureURL = "......jpg" 
     }, 
     new Customer 
     { 
      Id = 2, 
      firstName = "Svenja", 
      lastName = "Hofmeister", 
      emailAddress = "[email protected]", 
      company = "Germany", 
      pictureURL = "......jpg" 
     }, 
     new Customer 
     { 
      Id = 3, 
      firstName = "Marvin", 
      lastName = "Hofmeister", 
      emailAddress = "[email protected]", 
      company = "Germany", 
      pictureURL = "......jpg" 
     } 
    }; 



     public IEnumerable<Customer> GetAllCustomers() 
     { 
      return _customer; 
     } 

     public Customer GetCustomerById(int id) 
     { 
      var customer = _customer.FirstOrDefault(c => c.Id == id); 

      return customer; 
     } 
    } 
} 

然後我在JavaScript加載數據有:

function loadCustomer() { 

    jQuery.support.cors = true; 
    $.ajax({ 
     url: 'http://localhost:54172/api/customers', 
     type: 'GET', 
     dataType: 'json', 
     data:{}, 
     success: function (data) { 

      for (var i = 0; i < data.length; i++) { 
       var customer = new customer(
        '1', 
        data[i].id, 
        data[i].firstName, 
        data[i].lastname, 
        data[i].companyName, 
        data[i].emailAddress, 
        data[i].pictureURL); 

       self.customers.push(customer); 
      } 
     }, 
     error: function (x, y, z) { 
      alert(x + '\n' + y + '\n' + z + "TEST"); 
      console.log(x + '\n' + y + '\n' + z + "TEST"); 
     } 
    }); 
} 

和我問題在於該功能不會從控制器加載元素。相反,我收到一條錯誤消息[object Object]errorTEST

+0

我看不出你的API有什麼問題。嘗試將'url'更改爲'url:'/ api/customers''。 – Groyoh 2014-10-30 13:15:27

+0

是你的API調用會好嗎? – 2014-10-30 13:16:05

+0

檢查控制檯中的網絡選項卡以查看實際響應和錯誤。 – tymeJV 2014-10-30 13:16:58

回答

1

在阿賈克斯網址不符任何控制器或行動。如果腳本位於cshtml文件中,則可以使用url助手構建url。出於安全原因,如果您在此進行身份驗證,我建議使用POST而不是GET。最後,你可以使用responseText來查看實際的錯誤信息。

$.ajax({ 
    url: @Url.Action("Customers", "GetAllCustomers"), // or try 'http://localhost:54172/Customers/GetAllCustomers' 
    type: 'POST', 
    success: function (data) { 
     for (var i = 0; i < data.length; i++) { 
      var customer = new customer(
       '1', 
       data[i].id, 
       data[i].firstName, 
       data[i].lastname, 
       data[i].companyName, 
       data[i].emailAddress, 
       data[i].pictureURL); 

      self.customers.push(customer); 
     } 
    }, 
    error: function (x, y, z) { 
     alert(x.responseText + '\n' + y + '\n' + z + "TEST"); 
     console.log(x.responseText + '\n' + y + '\n' + z + "TEST"); 
    } 
}); 
+0

不能proplem因爲ie給了我可靠的數據 – 2014-10-31 08:11:23

0

嘗試改變網址這一個 - 在我看來,很顯然你應該改變一個AJAX網址(/控制器/動作),並從你的API控制器返回JSON> ControllerName /法

+0

不,它不起作用 – 2014-10-30 13:38:08

+0

您是否試圖將客戶數據顯示到不同的視圖或局部視圖中?如果是這種情況,那麼爲什麼不創建一個具有視圖模型的部分視圖來加載所有的東西呢? – frustratedprogrammer 2014-10-30 14:12:56

+0

沒有iam寫一個SPA一個html數據,所以我有htmldata的列表視圖 – 2014-10-30 14:19:13

0

。因此,我看不到在您的代碼中命名客戶的操作。

+0

我不知道你的意思 – 2014-10-30 13:48:29

+0

@cassteam有沒有需要一個名爲客戶的行動,也不需要返回JSON。 Web API自動將GET方法路由到以「Get」開頭並基於Accept標頭返回json的操作。檢查[這裏](http://www.asp.net/web-api/overview/web-api-routing-and-actions/routing-in-aspnet-web-api)和[here](http:// www.asp.net/web-api/overview/getting-started-with-aspnet-web-api/tutorial-your-first-web-api) – Groyoh 2014-10-30 13:53:11

0

API沒什麼問題,我懷疑這是你的JavaScript在試圖創建customer集合時炸燬了。嘗試添加這給JavaScript:

function customer(id, firstname, lastname, companyname, email, pic) { 
      this.Id = id; 
      this.FirstName = firstname; 
      this.LastName = lastname; 
      this.Company = companyname; 
      this.email = email; 
      this.Pic = pic; 
     } 

,並改變你創建變量,我已經改變了在我的例子cus ...

var cus = new customer(
         '1', 
         data[i].id, 
         data[i].firstName, 
         data[i].lastname, 
         data[i].companyName, 
         data[i].emailAddress, 
         data[i].pictureURL); 

        self.customers.push(cus); 
+0

抱歉,但錯誤不會消失與此:( – 2014-10-30 14:59:33

相關問題