Umesh Sehta
Umesh Sehta

Reputation: 10681

Get List from Backbone.js result

I am new in backbone.js I am try to fetch list from backbone result. Here is my code:-

Model:-

  public class Company12
  {
    public List<Company1> GetCompanies { get; set; }
    public int Page { get; set; }
  }

And my .js file

$(function () {


window.Company = Backbone.Model.extend({
    defaults: function () {
        return {
            order: Companies.nextOrder()
        };
    }
});

window.CompanyList = Backbone.Collection.extend({

    // Reference to this collection's model.
    model: Company,
    url: function () {
        var s = "api/Companies"
        return s;
    },
    nextOrder: function () {
        if (!this.length) return 1;
        return this.last().get('order') + 1;
    }


});

// Create our global collection of **Todos**.
window.Companies = new CompanyList;


// Todo Item View
// --------------

// The DOM element for a todo item...
window.CompaniesView = Backbone.View.extend({

    //... is a list tag.
    tagName: "li",

    // Cache the template function for a single item.
    template: _.template($('#item-template').html()),

    // The DOM events specific to an item.
    events: {


    },

    // The TodoView listens for changes to its model, re-rendering.
    initialize: function () {
        this.model.bind('change', this.render, this);
        this.model.bind('destroy', this.remove, this);
    },

    // Re-render the contents of the todo item.
    render: function () {
        $(this.el).html(this.template(this.model.toJSON()));
        this.setText();
        return this;
    },

    // To avoid XSS (not that it would be harmful in this particular app),
    // we use `jQuery.text` to set the contents of the todo item.
    setText: function () {
        var text = this.model.get('text');

        this.$('.name-text').text(text);
    }
});

// The Application
// ---------------

// Our overall **AppView** is the top-level piece of UI.
window.AppView = Backbone.View.extend({
    // Instead of generating a new element, bind to the existing skeleton of
    // the App already present in the HTML.
    el: $("#companiesRoot"),
    // At initialization we bind to the relevant events on the `Todos`
    // collection, when items are added or changed. Kick things off by
    // loading any preexisting todos that might be saved in *localStorage*.
    initialize: function () {
        this.input = this.$("#new-todo");
        Companies.bind('add', this.addOne, this);
        Companies.bind('reset', this.addAll, this);
        Companies.bind('all', this.render, this);
    },

    // Add a single todo item to the list by creating a view for it, and
    // appending its element to the `<ul>`.
    addOne: function (company) {
        var view = new CompaniesView({ model: company });
        this.$("#company-list").append(view.render().el);
    },

    // Add all items in the **Todos** collection at once.
    addAll: function () {
        Companies.each(function (p, s) {
            alert(JSON.stringify(p));

        });
        Companies.each(this.addOne);
    }

 });
 // Finally, we kick things off by creating the **App**.
 window.App = new AppView;

});

In Addall function i am getting :-

{"order":1,"GetCompanies":[{"id":21,"text":"Testing Company","done":false,"order":3},{"id":10,"text":"WebTech Solution","done":false,"order":3},{"id":5,"text":"Software Solution","done":false,"order":3}],"Page":0}

this result how can i fetch all GetCompanies. Please help thanks in advance.

Upvotes: 0

Views: 468

Answers (1)

Loamhoof
Loamhoof

Reputation: 8293

When you're fetching a collection, you should return a list, while you're returning a JSON with a list inside it. So you have 2 solutions here:

  1. Modify the response server-side: send only the GetCompanies part.
  2. Modify the response client-side (with Collection#parse).

So you'd have something like that inside your collection:

parse: function(response) {
  return response.GetCompanies;
}

Backbone will iterate over the values inside what you returned, and create Company with those (because you defined it as the model of your collection).

Upvotes: 1

Related Questions