current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise
up vote 0 down vote favorite

I have an api controller CustomerController that returns customers data:

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;
        }
    }
}

And then I load data in javascript with:

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");
        }
    });
}

and my problem is that the function don't load the elements from the controller. Instead I get an error message [object Object]errorTEST.

share|improve this question
    
I can't see anything wrong with your API. Try to change the url to url: '/api/customers'. – Groyoh Oct 30 '14 at 13:15
    
is your API calls going fine? – Moksh Shah Oct 30 '14 at 13:16
    
Check your network tab in the console to see the actual response and error. – tymeJV Oct 30 '14 at 13:16
    
can i do this when i have the webpage and the javascript on another folder on my pc? – Florian Hofmeister Oct 30 '14 at 13:17
    
i have check it and firebug say me the xml things they i needet as answere and the normal networkanalys say me SyntaxError: JSON.parse unexpected edn of data at line 1 column 1 of the JSON data – Florian Hofmeister Oct 30 '14 at 13:19
up vote 0 down vote accepted

The url in your ajax doesn't match any controller or action. If the script is in a cshtml file you can use the url helper to build the url. For security reasons, I recommend using POST instead GET if you have authentication in this. Last, you can use responseText to see the actual error message.

$.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");
    }
});
share|improve this answer
    
that cant be the proplem because the ie give me the rigth data – Florian Hofmeister Oct 31 '14 at 8:11
up vote 0 down vote

try changing the url to this one --> ControllerName/Method

share|improve this answer
    
no it does not work – Florian Hofmeister Oct 30 '14 at 13:38
    
Are you trying to display the customers data into a different view or partial view? If that's the case then why don't you just create a partial view that has a viewmodel where it would load all your stuff? – frustratedprogrammer Oct 30 '14 at 14:12
    
no iam writing an SPA one html data and so i have the listview for the htmldata – Florian Hofmeister Oct 30 '14 at 14:19
up vote 0 down vote

in my opinion you should obviously change url in ajax (/controller/action) and return json from your api controller. Therefore i don't see action named customers in your code.

share|improve this answer
    
i dont know what you mean – Florian Hofmeister Oct 30 '14 at 13:48
    
@cassteam There's no need for an action named customers nor to return json. Web API automatically routes GET method to actions that start by Get and returns json based on the Accept header. Check here and here – Groyoh Oct 30 '14 at 13:53
up vote 0 down vote

There is nothing wrong with the API, I suspect it's your JavaScript that's blowing up when trying to create the customer collection. Try adding this to the 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;
        }

And alter the variable you're creating, I have changed to cus in my example...

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);
share|improve this answer
    
sorry but the error dont go away with this :( – Florian Hofmeister Oct 30 '14 at 14:59

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.