---

• Next »
• « Previous

Association between Models:

Ext JS provides an easy ways of defining associations between models. Let's see how to define one-to-one, one-to-many and many-to-many relationships.

One-to-One :

The following example demonstrates how to define one-to-one relationship between two models.

Ext.define('Address', {
    extend: 'Ext.data.Model',

    fields: [
        { name: 'addressId', type: 'int' },
        'address',
        'city',
        'state'
    ],
    identifier: {
        type: 'negative'
    }

});

Ext.define('Student', {
    extend: 'Ext.data.Model',
    
    idProperty:'Id',
    fields: [
        { name: 'Id', type: 'int' },
        'firstName',
        'lastName',
        { name:'addressId', reference:'Address', unique: true}
    ],
    identifier: {
        type: 'negative'
    }

});

var studentRecord = Ext.create('Student',{
    firstName:'James',
    lastName: 'Bond'
});


var address = Ext.create('Address', {
    address: 'Y Street'
})

studentRecord.address = address;

Try it on https://fiddle.sencha.com/#fiddle/s65

In the above example, the Student model includes a filed 'addressId' with the reference of 'Address' and set it unique. This makes one-to-one relationship between Student and Address model.

One-to-Many:

There are two ways to define one-to-many relationships in Ext JS, using hasMany config of Ext JS 4 or new reference config.

The following example demonstrates how to define one-to-many relationship using simple hasMany config.

Ext.define('Student', {
    extend: 'Ext.data.Model',
    
    idProperty:'Id',
    fields: [
        { name: 'Id', type: 'int' },
        'firstName',
        'lastName'
    ],
    identifier: {
        type: 'negative'
    },

    hasMany: {
        name: 'Courses',
        model:'Course'
    }
});

Ext.define('Course', {
    extend: 'Ext.data.Model',
    idProperty: 'Id',
    fields: [
        { name: 'Id', type: 'int' },
        'courseName'
    ],
    identifier: {
        type: 'negative'
    }
});

var course1 = Ext.create('Course', {
    courseName: 'Ext JS 4'
})

var course2 = Ext.create('Course', {
    courseName: 'Ext JS 5'
})
var studentRecord = Ext.create('Student',{
    firstName:'James',
    lastName: 'Bond'
});

var courses = studentRecord.Courses();
courses.add(course1);
courses.add(course2);

Try it on https://fiddle.sencha.com/#fiddle/s67

Many-to-Many:

Ext JS provides an easy way to define many-to-many relationships between models using manyToMany config.

The following example demonstrates how to define many-to-many relationships.

Ext.define('Student', {
    extend: 'Ext.data.Model',
    
    idProperty:'Id',
    fields: [
        { name: 'Id', type: 'int' },
        'firstName',
        'lastName'
    ],
    identifier: {
        type: 'negative'
    },
    manyToMany: 'Course' 
});

Ext.define('Course', {
    extend: 'Ext.data.Model',
    idProperty: 'Id',
    fields: [
        { name: 'Id', type: 'int' },
        'courseName'
    ],
    identifier: {
        type: 'negative'
    }
});

var course1 = Ext.create('Course', {
    courseName: 'Sencha Touch'
})

var course2 = Ext.create('Course', {
    courseName: 'Sencha Architect'
})
var studentRecord = Ext.create('Student',{
    firstName:'steve',
    lastName: 'Jobs'
});

var course1 = Ext.create('Course', {
    courseName: 'ExtJS 4'
});

var course2 = Ext.create('Course', {
    courseName: 'ExtJS 5'
});

var course3 = Ext.create('Course', {
    courseName: 'ExtJS 6'
});

var student1 = Ext.create('Student', {
    firstName: 'Bob',
    lastName: 'Friss'
});

var student2 = Ext.create('Student', {
    firstName: 'James',
    lastName: 'Bond'
});

var student3 = Ext.create('Student', {
    firstName: 'Sachin',
    lastName: 'Tendulkar'
});

var courses = student1.courses();
courses.add(course1);
courses.add(course2);

var students = course3.students();
students.add(student2);
students.add(student3);

Try it on https://fiddle.sencha.com/#fiddle/s68

---

---

• Next »
• « Previous