1. #1
    Sencha Premium Member
    Join Date
    Apr 2012
    Location
    Mumbai, India
    Posts
    191
    Answers
    10
    Vote Rating
    0
    bomslang has a little shameless behaviour in the past

      -1  

    Exclamation Unanswered: ExtJS form submission ?

    Unanswered: ExtJS form submission ?


    Folks,

    I have a form data to be submitted to the server. I am sending this to server side using REST.
    There's no issue with REST code.

    But I don't know how to send the form record to the server side code ?

    E.g
    Code:
    Ext.define('Record', {
                extend: 'Ext.data.Model',
                fields: [{name: 'id', type:'int'}, {name:'content', type:'string'} ,{name: 'name', type:'string'} ,{name:'title', type:'string'}],
                proxy: new Ext.data.proxy.Rest({
              api: {
                        read : 'feedback/read.action',
                        create : 'feedback/create.action',
                        update: 'feedback/update.action',
                        destroy: 'feedback/delete.action'
                    },
                    reader: {
                        type: 'json',
                        root: 'data',
                        totalProperty: 'total',
                        successProperty: 'success'
                    },
                    writer: {
                        type: 'json',
                        encode: true,
                             writeAllFields: true
                    }
                })
            });
            
      var record = Ext.create('Record');
      var store = new Ext.data.Store({
                model: record,
                autoSave: false,
                autoLoad: true
            });
    and in the same app.js, I have this form ..

    Code:
    items: [{
                        xtype: 'fieldcontainer',
                        fieldLabel: 'Last Three Jobs',
                        labelWidth: 100,
                        layout: {
                            type: 'vbox',
                            align: 'stretch'
                        },
                        items: [{
                            xtype: 'textfield',
                            fieldLabel: 'Name',
                            name: 'name',
                            flex: 1
                        }, {
                            xtype: 'splitter'
                        }, {
                            xtype: 'textfield',
                            fieldLabel: 'Title',
                            name: 'title',
                            flex: 1
                        }, {
                            xtype: 'splitter'
                        }, {
                            xtype: 'textareafield',
                            grow: true,
                            fieldLabel: 'Content',
                            name: 'content',
                            flex: 1
                        }],
                    }, {
                        xtype: 'button',
                        text: 'Submit',
                        align: 'right',
                        handler: function() {
                            var form = this.up('form').getForm();
                             
                            if(form.isValid()) {
                            
                              // How to post the form values to server side REST ? 
                              // I am not sure if below code is correct ?
                              var values = form.getValues();
                               record.save('Record', values);
                               store.sync();
    Please point me in correct direction, if I am missing something.
    --
    Bomslang,
    Software Engineer,
    HTML5 Developer | ExtJS, Sencha Touch, GXT Passionate | Json Supporter

    Twitter : @bomslang

    ----------------------------------------------------------------------------------

    # Learn about Sencha Products via it's Documentation : ExtJS | Sencha Touch | GXT

    # Check for correct Json here : JSONLint.com

    # Want to code Sencha Touch Online ? Try SenchaFiddle.com

    # Want to code and test ExtJS Online ? Try http://ext4all.com/ & http://jsfiddle.net/

    # Must Read : 20 things to avoid / do when starting with ExtJS or Sencha Touch

  2. #2
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Answers
    102
    Vote Rating
    77
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    you could use form.submit();

    or if you truly want binding with models, you'll have to read this post: http://moduscreate.com/expert-ext-js...tion-in-forms/

  3. #3
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Answers
    102
    Vote Rating
    77
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    FWIW, the *manual* way of doing something like this was detailed inside of Ext JS in Action for 3.x!

  4. #4
    Sencha Premium Member
    Join Date
    Apr 2012
    Location
    Mumbai, India
    Posts
    191
    Answers
    10
    Vote Rating
    0
    bomslang has a little shameless behaviour in the past

      0  

    Default


    Is this the right way ?
    Code:
    form.submit({
        success: function(response) {
               Ext.Msg.alert('Success');
        }, 
       failure: function(response) {
              Ext.Msg.alert('Failed');
       });
    But where am I submitting the values in form submit way ?
    --
    Bomslang,
    Software Engineer,
    HTML5 Developer | ExtJS, Sencha Touch, GXT Passionate | Json Supporter

    Twitter : @bomslang

    ----------------------------------------------------------------------------------

    # Learn about Sencha Products via it's Documentation : ExtJS | Sencha Touch | GXT

    # Check for correct Json here : JSONLint.com

    # Want to code Sencha Touch Online ? Try SenchaFiddle.com

    # Want to code and test ExtJS Online ? Try http://ext4all.com/ & http://jsfiddle.net/

    # Must Read : 20 things to avoid / do when starting with ExtJS or Sencha Touch

  5. #5
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Answers
    102
    Vote Rating
    77
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    Quote Originally Posted by bomslang View Post
    Is this the right way ?
    Code:
    form.submit({
        success: function(response) {
               Ext.Msg.alert('Success');
        }, 
       failure: function(response) {
              Ext.Msg.alert('Failed');
       });
    But where am I submitting the values in form submit way ?
    You're doing it in your "submit button" handler.

Thread Participants: 1

Tags for this Thread