Question

I tried to use model.save() to POST a new user. But I check request payload and found that it not only sent the data, but also sent other parts of the model. That makes my server cannot parse the payload.

The request payload generated :

{"phantom":true,"internalId":"ext-record-58","raw":{},"data":{"userId":0,"userName":"Amy"},"modified":{"userName":""},"hasListeners":{},"events":{},"stores":[],"dirty":true,"id":"AM.model.User-ext-record-58"}

But the desired request payload should be :

{"userId":0,"userName":"Amy"}

And I am aware that the “phantom” of my model is false before I call model.save(). But it becomes true in the request payload. Is it a clue?

Model:

 Ext.define('AM.model.User',{
        extend: 'Ext.data.Model',
        fields: [
            { name: 'userId', type: 'int' },
            { name: 'userName', type: 'string' },
            { name: 'createdTime', type: 'string' },

        ],
        idProperty: 'userId',
        associations: [
        {
            type: 'hasOne',
            model: 'AM.model.ModelA',
            name:'modelA',
            associationKey:'modelA',
            getterName:'modelA'
        },
        {
            type: 'hasOne',
            model: 'AM.model.ModelB',
            name:'modelB',
            associationKey:'modelB',
            getterName:'modelB'
        }
        ],
        proxy: {
            type: 'rest',
            success:true,
            url:'../restful/users',
            writer:{
                type:'json',
                getRecordData:function(record){ //parse createdTime to the format Y-m-d
                    record.set('createdTime', Ext.Date.format(new Date(record.get('createdTime')), "Y-m-d"));
                    return record;
                }   
            },
            reader: {
                type: 'json'
            }
        }
    });

---

This is the view which has the data to be posted. The view will fill the data to the model:

Ext.define('AM.view.UserRegisterForm',{
    extend:'Ext.form.Panel.',
    alias:'widget.userRegisterForm',
    fields:new Array(), //I want to render the fields in xtemplate, so instead of adding the fields to items, I use an array to manage them.

    retrieveData(model){
        model.set('userName', this.fields[0].getValue());
        model.set('createdTime',this.fields[1].getValue());
    }
}

---

The function in the controller, which sends the POST request:

postUser:function(){
    var userRegisterForm= this.getUserRegisterForm();
    var userModel = this.getUserModel();
    var user= new userModel();
    var me = this;

    userRegisterForm.retrieveFieldData(user);
    console.log(user); //the data in console looks fine!
    user.save({
        success: function(response) {
            //do something...
        },failure:function(response) {
            alert('fail');
        }
    });
}

Answer 1

You are returning the full record when you override getRecordData Where as you are just meant to return the records data. record.getData()

Some extra advice. Don’t override getRecordData to set the models creation date. Use the models defaultValue property to give assign it a new Date if one doesn’t exist.