0

in the following example when we click the button, all the form data (both the KEY-VALUE) will be passed to the php file to be saved in the database. Grabbing the KEY-VALUE is done by var form = this.up('form').getForm(); statement.

UPDATE 3

Ext.define ('Mycomp.model.MyClass',{
    extend: 'Ext.data.Model',

    fields:['textfieldone']

});

========================================================================

UPDATE 2

When a user clicks on a button, i display the View that has one textfield and a button (as shown in the following code). The user will enter some values and click on the button, and the value entered by the user in the text field should be saved in the DB (The Store has the link to the path of the PHP code)

CONTROLLER

Ext.define('Mycomp.controller.MyClass',{
    extend: 'Ext.app.Controller',

    stores:['MyClass'],
    models:['MyClass'],
    views:['MyClassView'],
    init: function(){
        this.control({          
            'myclassview button[action=save]': {
                click: this.myMethod
            }
        });         
        },
        myMethod: function(button,record) {
               var win    = button.up('window'),
               form   = win.down('form'),
               record = form.getForm().getRecord(),
               values = form.getForm().getValues();
               console.log (values);
               console.log (record);
               record.getRecord().set(values);         
           win.close();
           this.this.getMyClassStore().sync(); 
    }
});

VIEW

Ext.define('Mycomp.view.user.MyClassView', {
    extend: 'Ext.window.Window',
    alias: 'widget.myclassview',
    initComponent: function() {
        this.items = [
            {
                xtype: 'form',
                items: [
                    {
                        xtype: 'textfield',
                        name : 'textfieldone',
                        fieldLabel: 'Contact Person Name'
                    }
                ]
            }
        ];
        this.buttons = [
                        {
                            text: 'Save',
                            name:'save',
                            action: 'save'
                        }
                    ];
        this.callParent(arguments);
    }
});

STORE

Ext.define('Mycomp.store.Myclass',{
    extend:'Ext.data.Store',
    model:'App.model.Myclass',

    proxy: {
        actionMethods : {
            create : 'POST'
        },
        type: 'ajax',
        url : '/savetodb.php'

    }

});

===============================================================================

UPDATE 1

 ....  this.buttons = [
                            {
                                text: 'Save',

                                action: 'save'
                            }, ...

STORE

Ext.define('Mycomp.store.Myclass',{
    extend:'Ext.data.Store',
    model:'App.model.Myclass',

    proxy: {
        actionMethods : {
            create : 'POST'
        },
        type: 'ajax',
        url : '/savetodb.php'

    }

});

CONTAROLLER

this.control({

            'mycalssform button[action=save]': {
                click: this.myMethod
            }
        });


        },

        myMethod: function(button, record) {

               var win    = button.up('window'),
               form   = win.down('form'),
               record = form.getRecord(),
               values = form.getValues();
               console.log (record);
      console.log (values );

           record.set(values);
           win.close();
           this.this.getmyClassStore().sync(); 

FIREBUG OUT PUT >> It says RECORD IS UNDEFINED . Why is this ?

undefined

Object { textfileldone="hello", textfileldtwo="bever", more...}

record is undefined
[Break On This Error]   

record.set(values);
Illep
  • 16,375
  • 46
  • 171
  • 302
  • 1
    Why is this down voted, even without a comment – Illep Jul 03 '12 at 09:46
  • is `textfieldone` part of your model? – Izhaki Jul 03 '12 at 10:21
  • `textfieldone` is part of Model, and also in the MySQL db i have named a column as `textfieldone`, and also in the View i have a textfield with the name `textfieldone`. – Illep Jul 03 '12 at 10:54
  • Could you post the request (shown in firebug or chrome developer tools)? – Izhaki Jul 03 '12 at 11:09
  • I have updated my question, and i have added my latest code, and now i get an error saying `Record is undefined`. Can you please help me here ? – Illep Jul 03 '12 at 11:21
  • When i print the `record` it says `undefined` in firebug. but when i print `value` i get some values in firebug – Illep Jul 03 '12 at 11:23
  • I'm pretty sure you need `form.getForm().getRecord()` and `form.getForm().getValues()` – Izhaki Jul 03 '12 at 11:28
  • Do you mean to replace `record = form.getRecord()` with `record = form.getForm().getRecord()` and `values = form.getValues()` with `values = form.getForm().getValues()` ?? Still it doesn't work, i get the same message `form.getForm() is undefined` – Illep Jul 03 '12 at 11:35
  • I see. Your issue seem to be very basic. Could you post the full code of your controller; the code of your view; and how and where you load a record onto the form? – Izhaki Jul 03 '12 at 11:53
  • See **UPDATE 2** i have included the files. – Illep Jul 03 '12 at 12:04
  • OK, why would the form have a record? Have you created a new model record anywhere and called `form.loadRecord()`? – Izhaki Jul 03 '12 at 12:07
  • No i haven't have anything called `form.loadRecord()` – Illep Jul 03 '12 at 12:15

1 Answers1

2

In order for the form to be 'bound' to a record you'd need to create a new model instance and call form.loadRecord() - only after doing so you'll form.getRecord() will work.

Alternatively (which would be suitable if you only use to form with new records), you can simply create a new model record upon save and set its values.

Something along these lines will create a new model record:

var iStore = this.getmyClassStore();
var iModel = iStore.model; 
var iNewRecord = iModel.create();

You can then perform:

iValues = form.getValues();
iNewRecord.set( iValues );

And then you'll need to add the new record to the store:

iStore.add( iNewRecord )

So your code should look like this:

    myMethod: function(button, record) {

           var win    = button.up('window'),
               form   = win.down('form'), 
               values = form.getValues(),
               store = this.this.getmyClassStore(),
               model = store.model,
               record = model.create();


               record.set( values );
               store.add( record );
               win.close();
               store.sync(); 
    }
Izhaki
  • 23,372
  • 9
  • 69
  • 107
  • Well, i already have defined a Model. And i have included it above (under update 3). Do you want me to add those 3 lines of code to that Model class ? – Illep Jul 03 '12 at 12:28
  • All I'm saying is that your form is not referencing a model record. Somewhere in your code you need to create the right model record (the model of the store) and then set the values you get from the form. Would you be able to work this out or do you need me to copy/paste/change the code you have posted? – Izhaki Jul 03 '12 at 12:36
  • Please, could you kindly copy paste the code. I am a bit stuck with this all day – Illep Jul 03 '12 at 12:38
  • Yes, i got rid of that error. but the record that i am passing is not getting displayed when i echo $_POST[textfieldone]; – Illep Jul 03 '12 at 12:51
  • Would help to see the definition of your model. Also, the request debug of firebug/chrome developer tools... – Izhaki Jul 03 '12 at 14:23
  • There's no such error message, the PHP file gets executed, and all string echo statements gets printed, except for `echo $_POST['textfieldone'];` – Illep Jul 03 '12 at 18:12
  • How do I do a put instead of a post in this? – Arun Aug 20 '14 at 19:29