1. #1
    Ext JS Premium Member
    Join Date
    Feb 2009
    Posts
    47
    Vote Rating
    0
    clemence is on a distinguished road

      0  

    Default Unanswered: REST + form submit

    Unanswered: REST + form submit


    I am trying MVC architecture + REST + form. I have some difficulties with the new syntax.

    My store:
    Code:
    var userstore = Ext.define('APP.store.Users', {
        extend: 'Ext.data.Store',
        model : 'APP.model.User',
        autoLoad : true,    
        proxy : {
             type : 'rest',
             url : url_server + 'user',
             reader : {
                 type : 'json',
                 root : 'users'
             },
             writer : {
                 type : 'json',
                 writeAllFields : false,
                 root : 'users',
                 encode:false    
             }
         }
    });
    My view :
    Code:
    Ext.define('APP.view.user.edit' , {
    
        extend: 'Ext.form.Panel',    
        alias : 'widget.useredit',
        title : 'Edit a user',
        store: 'Users',    
        bodyPadding: 5,
        width: 350,
        layout: 'anchor',
        defaults: {
            anchor: '100%'
        },
    submitOnAction : false,
        // The fields
        defaultType: 'textfield',
        items: [...],
       
        buttons: [{
            text: 'Reset',
            handler: function() {
                this.up('form').getForm().reset();
            }
        }, {
            text: 'Submit',     
            handler: function() {
                var form = this.up('form').getForm();
                if (form.isValid()) {
                  
                    var values = form.getValues();
                   
                    var obj = Ext.create('APP.model.User',values);
                    
                   //what HERE?
                }
            }
        }],
        renderTo: Ext.getBody()
    });
    My questions :
    - I tried to make it work with submit but it doesn't work, is it possible?
    - I tried the following lines without success instead of "//what HERE":
    userstore.insert(0,obj);
    userstore.sync();
    and obj.save();
    and userstore.add(obj);
    --> I can't do that APP.model.User.insert(..), why?
    --> how can I add my form values to my store?

  2. #2
    Sencha User
    Join Date
    May 2008
    Posts
    45
    Vote Rating
    0
    codeart.ch is on a distinguished road

      0  

    Default


    I'm not sure if your store is needed because you access the model directly

    Code:
     Ext.create('APP.model.User',values)
    But you have defined the proxy only in the store. You should define it in the model instead.

    I just have a model with a proxy and use record.save() function to send my record to the server.
    this looks something like this
    Code:
    Ext.define('Record', {
        extend: 'Ext.data.Model',
         fields: ['id', 'name', 'email'],
         proxy: {
             type: 'rest',
             url : '/record'
         }
     });
    Code:
    record.save({
         success:function(rec,op) {
             alert('ok';)
         },
         failure:function(rec,op) {
             alert('error';)
         }
    });
    hope this helps a bit

  3. #3
    Ext JS Premium Member
    Join Date
    Feb 2009
    Posts
    47
    Vote Rating
    0
    clemence is on a distinguished road

      0  

    Default


    thank you, it works with the proxy in the model.
    But I still don't understand how get a component when you define it like this:

    Ext.define('mygrid',{...}); --> ?
    instead of var mygrid= new Ext.grid.EditorGridPanel({...}); --> grid.myfunction();

    do you know?

  4. #4
    Sencha User
    Join Date
    May 2008
    Posts
    45
    Vote Rating
    0
    codeart.ch is on a distinguished road

      0  

    Default


    Ext.define isn't the same as new. it just defines a object after that you can create it with var xx = new mygrid or var xx = Ext.create('mygrid',{})

  5. #5
    Ext JS Premium Member
    Join Date
    Feb 2009
    Posts
    47
    Vote Rating
    0
    clemence is on a distinguished road

      0  

    Default


    yes you're right I forgot it, it like a class and an object, it makes sence... so when you are doing an MVC architecture, you define all the class with ext.define for store/model/view/controller and in app.js you do an ext.create to init a new object (your application), and you attached some controllers. Then, in your controller, in the function init you create your object view. So my question is : when you are in a class (ext.define), you should use "this" to access to your object, it is working for the event listener because it is at the same level but it is not working when you defined docked items because you are in a sublevel (in term of dom)... so what is the syntax for doing something like this : this.up(???).this.getSelectionModel().getSelection()?

    (as we do in an object : var selection = grid.getView().getSelectionModel().getSelection()[0]

    Code:
    Ext.define('APP.view.chain.list' , {
    
        extend: 'Ext.grid.Panel',    
        alias : 'widget.chainlist',
        title : 'All chains',
        store: 'Chains',    
        dockedItems: [{
        ...
            }, {
                iconCls: 'icon-delete',
                text: 'Delete',
                disabled: true,
                itemId: 'delete',            
                handler: function(){
               ??? .getSelectionModel().getSelection();
                    }
                }
            }]}]

Thread Participants: 1