Hadi Nahavandi
Hadi Nahavandi

Reputation: 662

sending data using POST method in sencha extjs rest webservice

I wanna save a model by sending data using post method to my web server, I wrote these codes and noticed that sencha is sending data using the GET method. how can I send the data using POST method? my model code:

Ext.define('MyApp.model.emp.Roles', {
    extend: 'MyApp.model.Base',

    fields: [
        {
            type: 'int',
            name: 'id'
        },
        
{
            type: 'string',
            name: 'title'
        },
    ],
    proxy: {
        type: 'ajax',
        url : 'http://myweb.test/json/fa/myweb/managerole.jsp',
        idParam: 'id',
        extraParams: {
            'action':'btnSave_Click'
        },

        method:'POST',
        actionMethods: {
            create : 'POST',
            read   : 'POST',
            update : 'POST',
            destroy: 'POST'
        },
    }
});

save calling code:

{
            xtype: 'button',
            text:  'ذخیره',
            handler:function()
            {
                var user = Ext.create('MyApp.model.emp.Roles', {title: 'A Role From Sencha'});
                user.set('title','hi');
                user.set('id',-1);
                user.save({
                    params: user.getData(),
                    callback: function (records, operation) {
                        Ext.Msg.alert('User Save', operation.getResponse().responseText);
                    },
                    methodName:'POST',
                    method:'POST',
                });

            }
        }

Upvotes: 0

Views: 2182

Answers (1)

Narendra Jadhav
Narendra Jadhav

Reputation: 10262

If you are using model then you need to use only actionMethods.

actionMethods Mapping of action name to HTTP request method. In the basic AjaxProxy these are set to 'GET' for 'read' actions and 'POST' for 'create', 'update' and 'destroy' actions. Defaults to:

{
    create: 'POST',
    read: 'GET',
    update: 'POST',
    destroy: 'POST'
} 

In this FIDDLE, I have created a demo using model and button. I hope this will help/guide your to achieve your requirement.

*NOTE I have used only local url. I don't have any live url. You can see in network request data is sending in url.

CODE SNIPPET

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.define('MyModel', {
            extend: 'Ext.data.Model',
            fields: ['version', 'code', 'framework', 'frameworkVersion', 'fiddleid', 'inspector', 'session'],
            proxy: {
                type: 'ajax',
                url: 'local', //I am providing local url in your case you can provide your rest webservice url
                useDefaultXhrHeader: false,
                actionMethods: {
                    create: 'POST', //When you want to save/create new record
                    read: 'GET', //When you want to get data from server side
                    update: 'PUT', //When you want to update the record
                    destroy: 'DELETE' //When you want to delete the record
                },
                paramAsJson: true // if You  want to encode the data from clint side then it should be true otherwise false
            }
        });

        Ext.create({
            fullscreen: true,
            renderTo: Ext.getBody(),
            xtype: 'panel',
            title: 'sending data using POST method in sencha extjs rest webservice',
            padding: 10,
            items: [{
                xtype: 'button',
                text: 'Send Data',
                margin: 15,
                style: {
                    background: '#ccc'
                },
                height: 50,
                width: '100%',
                handler: function () {
                    var MyModel = Ext.create('MyModel', {
                        version: "2",
                        code: '',
                        framework: "291",
                        frameworkVersion: "",
                        fiddleid: "",
                        inspector: "",
                        session: ''
                    });
                    MyModel.save({
                        success: function (records, operation) {
                            //When data will save on sever side then response will come in success
                            Ext.Msg.alert('User Save', 'Data saved');
                        },
                        failure: function (records, operation) {
                            //If some error occure on server side the reponse will come in failure function
                            Ext.Msg.alert(`Error ${operation.error.status}`, operation.error.statusText);
                        }
                    });
                }
            }]
        });
    }
});

Upvotes: 1

Related Questions