1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    3
    Vote Rating
    0
    jrds is on a distinguished road

      0  

    Default Unanswered: Extjs Data Model Associations Problem, What am I doing wrong?

    Unanswered: Extjs Data Model Associations Problem, What am I doing wrong?


    This is my first post and I'm new to Ext JS.
    I'm trying to manipulate SimpleTasks example of sencha extjs to my needs.
    I've added a new model called Comment which is "belongsTo" Task model and also Task model has "hasMany" association with Comment model. I hope the idea is clear and simple.
    Here are my models:

    Code:
    Ext.define('SimpleTasks.model.Task', {
        extend: 'Ext.data.Model',
        fields: [
            { name: 'id', type: 'int' },
            { name: 'title' },
            { name: 'list_id', type: 'int' },
            { name: 'due', type: 'date'},
            { name: 'reminder', type: 'date' },
            { name: 'done', type: 'boolean', defaultValue: false },
            { name: 'note' }
        ],
        proxy:  {
            type  : 'ajax',
            api   : {
                create : 'php/task/create.php',
                read   : 'php/task/read.php',
                update : 'php/task/update.php',
                destroy: 'php/task/delete.php'
            },
            reader: {
                type           : 'json',
                root           : 'tasks',
                messageProperty: 'message'
            }
        },
        associations: [
            {
                type          : 'hasMany',
                model         : 'Comment',
                primaryKey    : 'id',
                foreignKey    : 'task_id',
                autoLoad      : true,
                associationKey: 'taskComments'
            }
        ]
    });
    
    Ext.define('SimpleTasks.model.Comment', {
        extend      : 'Ext.data.Model',
        fields      : [
            { name: 'id', type: 'int' },
            { name: 'task_id', type: 'int', defaultValue: null },
            { name: 'comment_text', type: 'string'},
            { name: 'comment_time', type: 'timestamp'}
        ],
        proxy       : {
            type  : 'ajax',
            api   : {
                create : 'php/comment/create.php',
                read   : 'php/comment/read.php',
                update : 'php/comment/update.php',
                destroy: 'php/comment/delete.php'
            },
            reader: {
                type           : 'json',
                root           : 'comments',
                messageProperty: 'message'
            }
        },
        associations: [
            {
                type          : 'belongsTo',
                model         : 'Task',
                primaryKey    : 'id',
                foreignKey    : 'task_id',
                associationKey: 'task'
            }
        ]
    });
    When i get a row from task model it doesn't return comments.
    task is a variable that i

    Code:
        handleEditIconClick: function (view, rowIndex, colIndex, column, e) {
            var task = view.getRecord(view.findTargetByEvent(e));
            console.log(task.taskComments());
            this.showEditBox(task);
        }
    Console outputs: Uncaught TypeError: Object [object Object] has no method 'taskComments'

    What am I doing wrong?

  2. #2
    Sencha User
    Join Date
    Apr 2010
    Posts
    76
    Vote Rating
    5
    Answers
    3
    HriBB is on a distinguished road

      0  

    Default


    http://docs.sencha.com/ext-js/4-1/#!...sMany-cfg-name

    You need to pass association name to the config. Docs say:
    Code:
    The name of the function to create on the owner model to retrieve the child store. If not specified, the pluralized name of the child model is used.
    Try it like this:

    Code:
    Ext.define('SimpleTasks.model.Task', {
        extend: 'Ext.data.Model',
        fields: [
            { name: 'id', type: 'int' },
            { name: 'title' },
            { name: 'list_id', type: 'int' },
            { name: 'due', type: 'date'},
            { name: 'reminder', type: 'date' },
            { name: 'done', type: 'boolean', defaultValue: false },
            { name: 'note' }
        ],
        proxy:  {
            type  : 'ajax',
            api   : {
                create : 'php/task/create.php',
                read   : 'php/task/read.php',
                update : 'php/task/update.php',
                destroy: 'php/task/delete.php'
            },
            reader: {
                type           : 'json',
                root           : 'tasks',
                messageProperty: 'message'
            }
        },
        associations: [
            {
                type          : 'hasMany',
                name          : 'taskComments', // or getComments or just comments ... doesn't really matter
                model         : 'Comment',
                primaryKey    : 'id',
                foreignKey    : 'task_id',
                autoLoad      : true,
                associationKey: 'taskComments'
            }
        ]
    });
    
    Ext.define('SimpleTasks.model.Comment', {
        extend      : 'Ext.data.Model',
        fields      : [
            { name: 'id', type: 'int' },
            { name: 'task_id', type: 'int', defaultValue: null },
            { name: 'comment_text', type: 'string'},
            { name: 'comment_time', type: 'timestamp'}
        ],
        proxy       : {
            type  : 'ajax',
            api   : {
                create : 'php/comment/create.php',
                read   : 'php/comment/read.php',
                update : 'php/comment/update.php',
                destroy: 'php/comment/delete.php'
            },
            reader: {
                type           : 'json',
                root           : 'comments',
                messageProperty: 'message'
            }
        },
        associations: [
            {
                type          : 'belongsTo',
                name          : 'task', // again you could use getTask or anything else here
                model         : 'Task',
                primaryKey    : 'id',
                foreignKey    : 'task_id',
                associationKey: 'task'
            }
        ]
    });
    Also try to console.log() task instead of task.taskComments(). Then search for the taskComment() function in output (be sure to check __proto__ as well ).
    Code:
    handleEditIconClick: function (view, rowIndex, colIndex, column, e) {    var task = view.getRecord(view.findTargetByEvent(e));
        console.log(task);
        this.showEditBox(task);
    }

  3. #3
    Sencha User
    Join Date
    Aug 2011
    Posts
    3
    Vote Rating
    0
    jrds is on a distinguished road

      0  

    Default


    I user your solution to name the association functions but it did not work out as I expected. Maybe I am missing a simpler point?

    I could not find 'taskComments' function in log (even i searched __proto__)

  4. #4
    Sencha User
    Join Date
    Aug 2011
    Posts
    3
    Vote Rating
    0
    jrds is on a distinguished road

      0  

    Default


    Since I'm using extjs with its mvc feature I should have used full referance syntax of the models' in my associations' config like below:
    Code:
    model         : 'SimpleTasks.model.Task'
    My issue solved by myself

Thread Participants: 1

Tags for this Thread