StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POExtJS4.1: Why model.save() sends wrong thing to server?
text
Body
copied!<p>I tried to use <code>model.save()</code> 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.</p> <p>The request payload generated : </p> <pre><code>{"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"} </code></pre> <p>But the desired request payload should be :</p> <pre><code>{"userId":0,"userName":"Amy"} </code></pre> <p>And I am aware that the "phantom" of my model is false before I call <code>model.save()</code>. But it becomes true in the request payload. Is it a clue?</p> <p>Model:</p> <pre><code> 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' } } }); </code></pre> <hr> <p>This is the view which has the data to be posted. The view will fill the data to the model:</p> <pre><code>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()); } } </code></pre> <hr> <p>The function in the controller, which sends the POST request:</p> <pre><code>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'); } }); } </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload