CODEWITHSUNDEEP
javascriptmodelstoreextjs4.1extjs-mvc
Rishabh Shah
Rishabh Shah

Reputation: 580

set field dynamically in the store in extjs or getCount() gives 0 in model

Hope you are doing good.

I have 2 different class University and Students

Relation : University hasMany Students

University fields: uni_id, uni_name,total_students Students fields: stud_id,stud_name

I have following json file:

{
    "data": [
        {
            "uni_id": 1,
            "uni_name": "Gujarat University",
            "openingYear": 1980,
            "students": [
                {

                    "stud_id": 1,
                    "stud_name": "Rishabh Shah"
                }, {

                    "stud_id": 2,
                    "stud_name": "Rakesh Prajapati"
                }, {

                    "stud_id": 3,
                    "stud_name": "Vaibhavi Shah"
                }, {

                    "stud_id": 4,
                    "stud_name": "Jitu Mishra"
                }, {

                    "stud_id": 5,
                    "stud_name": "Sonu Nigam"
                }, {

                    "stud_id": 6,
                    "stud_name": "K.K."
                }, {

                    "stud_id": 7,
                    "stud_name": "Amitabh Bachan"
                }
            ]
        }, {
            "uni_id": 2,
            "uni_name": "Saurastra University",
            "openingYear": 1985,
            "students": [
                {

                    "stud_id": 1,
                    "stud_name": "Rakhi Sawant"
                }, {

                    "stud_id": 2,
                    "stud_name": "Smit Patel"
                }, {

                    "stud_id": 3,
                    "stud_name": "Kashyap Thaker"
                }
            ]
        }, {
            "uni_id": 3,
            "uni_name": "North Gujarat University",
            "openingYear": 1989,
            "students": [
                {

                    "stud_id": 1,
                    "stud_name": "Angellina Jollie"
                }, {

                    "stud_id": 2,
                    "stud_name": "Parag Raval"
                }, {

                    "stud_id": 3,
                    "stud_name": "Harshal Patel"
                }, {

                    "stud_id": 4,
                    "stud_name": "Harsha Bhogle"
                }, {

                    "stud_id": 5,
                    "stud_name": "Lata Mangeshkar"
                }
            ]
        }, {
            "uni_id": 4,
            "uni_name": "South Gujarat University",
            "openingYear": 1989,
            "students": [
                {

                    "stud_id": 1,
                    "stud_name": "Khushbu Shah"
                }, {

                    "stud_id": 2,
                    "stud_name": "Piyush"
                }, {

                    "stud_id": 3,
                    "stud_name": "Sakira"
                }, {

                    "stud_id": 4,
                    "stud_name": "Salman Khan"
                }, {

                    "stud_id": 5,
                    "stud_name": "Kishor Kumar"
                }, {

                    "stud_id": 6,
                    "stud_name": "Mohhamad Rafi"
                }, {

                    "stud_id": 7,
                    "stud_name": "V.V.S. Lakshman"
                }, {

                    "stud_id": 8,
                    "stud_name": "Rahul Dravid"
                }, {

                    "stud_id": 9,
                    "stud_name": "Shane Worn"
                }, {

                    "stud_id": 10,
                    "stud_name": "Neel Armstrong"
                }
            ]
        }
    ]
}

I want to load total_stud mentioned in University model.

total_stud is no. of students in university..

I tried with following things in University model.

fields:'total_stud', 
type:integer,
convert:function(value,record)
{
return record.students().getCount();
}

I have also set total_stud, but, I get 0 total_stud. when i see the record.students(), I get all the students with that university..but, why I am not getting getCount().

Thanks ! :)

Upvotes: 0

Views: 5140

Answers (1)

alexrom7
alexrom7

Reputation: 864

The way I see it, the field total_students is a calculated value. I think that you should not include this field in your Model, because you could always calculate the correct value when you need to display it.

I thought of two posible solutions for this:

1. Keeping the total_students field in University Model

    Ext.define("University", {
    extend: 'Ext.data.Model',
    fields: ['uni_id', 'uni_name', 'openingYear','total_students'],
    hasMany: {
      model: 'Student',
      name: 'students'
    },
    });

    Ext.define("Student", {
    extend: 'Ext.data.Model',
    fields: ['stud_id', 'stud_name']
    });


    /* Here we create the store. The data variable is 
       the same json that you posted.  */
    var store = Ext.create('Ext.data.Store', {
    model: "University",
    autoLoad: true,
    data: data,

    proxy: {
      type: 'memory',
      reader: {
          type: 'json'
      }
    },

    listeners: {
    /* This listener activates every time the store is loaded and what it does,
       is iterate through each University record and updates the 
       'total_students' field with the correct value */
      load: function (store, records) {
          store.each(function (record) {
              record.set('total_students', record.students().getCount());
          });
       }
     }
    });

    Ext.create('Ext.grid.Panel', {
    title: 'Universities',
    store: store,
    viewConfig: {
         markDirty: false
    },
    columns: [
         {text: 'ID',dataIndex: 'uni_id'},
         {text: 'Name',dataIndex: 'uni_name',flex: 1},
         {text: 'Opening Year',dataIndex: 'openingYear'},
         {text: 'Total Students',dataIndex: 'total_students'}
    ],
   height: 200,
   width: 500,
   renderTo: Ext.getBody()
   });

http://jsfiddle.net/alexrom7/386ab/4/

This option will work, but it doesn't seem right. The option that I would recommend is the next one.

2. Removing the total_students field from University Model

The differences between this option and the last one, is that we removed the total_students field, so there is no need to create a load listener in the University Store but now we have to calculate the total_students given a University record if we need to display it.

    Ext.define("University", {
    extend: 'Ext.data.Model',
    fields: ['uni_id', 'uni_name', 'openingYear'],
    hasMany: {
      model: 'Student',
      name: 'students'
    },
    });

    Ext.define("Student", {
    extend: 'Ext.data.Model',
    fields: ['stud_id', 'stud_name']
    });


    /* Here we create the store. The data variable is the same json that
       you posted.  */
    var store = Ext.create('Ext.data.Store', {
    model: "University",
    autoLoad: true,
    data: data,

    proxy: {
      type: 'memory',
      reader: {
          type: 'json'
      }
    }
    });



    Ext.create('Ext.grid.Panel', {
    title: 'Universities',
    store: store,
    columns: [
         {text: 'ID',dataIndex: 'uni_id'},
         {text: 'Name',dataIndex: 'uni_name',flex: 1},
         {text: 'Opening Year',dataIndex: 'openingYear'},
         {
          text: 'Total Students',
           renderer: function (val, meta, record) {
               return record.students().getCount();
           }
         }
    ],
   height: 200,
   width: 500,
   renderTo: Ext.getBody()
   });

http://jsfiddle.net/alexrom7/cL9wf/9/

I hope that I have been helpful.

Upvotes: 2

Related Questions