Is it possible to change the dafault methos POST that a store snync() request uses.
I have tried the following but it did not work. I would like to change the method from POST to PUT.
I am aware I can write a custom Ajax request but is there a way to do this with the store sync() functionallity?
store.sync({
method: 'PUT',
scope:this,
callback: function(batch, options){
},
success : function(batch, options) {
},
failure : function(batch, options) {
}
});
}
I have also tried this kind of approach without success:
store.getProxy().method = 'PUT';
In the proxy config for your store, you can configure the api to make specific request methods for each type of action.
For example:
proxy: {
type: 'ajax',
actionMethods: {
create: 'POST',
read: 'GET',
update: 'POST',
destroy: 'POST'
},
batchActions: false,
api: {
create: 'foo/sample.json',
read: 'bar/sampleB.json',
update: 'test/test.json',
destroy: 'admin/testa.json'
},
reader: {
type: 'json',
root: 'data'
},
writer: {
type: 'json'
}
}
EDIT
The code above gets generated from Sencha Architect, but if you are not using Architect you could define the api actions on your REST proxy like this:
proxy: {
type: 'rest',
api: {
create: {url: 'foo/sample.json', method: 'POST'},
read: {url: 'bar/sampleB.json', method: 'GET'},
update: {'test/test.json', method: 'PUT'},
destroy: {'admin/testa.json', method: 'POST'}
}
}
Related
I'm trying to get data from a webservice using ajax and POST method.
Ext.Ajax.request({
url: 'http://localhost......',
method:'POST',
success: function(response) { console.log(response.responseText); },
failure: function() { Ext.Msg.alert('Fail'); },
jsonData:{
/*Here I specify my request json*/
}
}
});
The above thing works fine but when i try to mimic the same in EXTJS store it responds with a error
he server responded with a status of 415 (Unsupported Media Type)
EXTJS STORE CODE
Ext.define('IWM.store.JsonTest', {
extend: 'Ext.data.Store',
autoLoad: true,
fields:['Name'],
proxy: {
type: 'ajax',
method : 'POST',
actionMethods: {
create : 'POST',
read : 'POST',
update : 'POST',
destroy: 'POST'
},
jsonData:{
/*JSON */
}
},
url: 'http://localhost......',
success: function(response) { console.log(response.responseText); },
failure:function(){console.log("failed");},
reader: {
type: 'json',
root: 'result',
successProperty: 'success'
}
}
});
First things first, try to change store config as below.
var IWMStore = new Ext.data.JsonStore({
// it seems to me you had forgotten model
model: 'YourDataModel',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'http://your-url-address',
reader: {
type: 'json',
root: 'json-root-value',
idProperty: 'unique-property-in-json-file'
}
}
});
Example JSON value :
// here, ctgMains is the root value, CUST_ASSORT_SECTION_ID is the idProperty
{"ctgMains":[{"CUST_ASSORT_SECTION_ID":"1","CTG_SECTION":"HORECA"},{"CUST_ASSORT_SECTION_ID":"7","CTG_SECTION":"SCO"},{"CUST_ASSORT_SECTION_ID":"3","CTG_SECTION":"TRADER"}]}
Second Attempt :
Try to add headers property in your proxy definition, like below:
proxy: {
type: 'ajax',
url: 'http://your-url-address',
reader: {
type: 'json',
root: 'json-root-value',
idProperty: 'unique-property-in-json-file'
},
headers: {
'Content-type': 'application/json',
'Accept': 'application/json'
}
}
Following on from Oğuz Çelikdemir's answer, you may need to define a json writer for your proxy.
proxy: {
type: 'ajax',
url: 'http://your-url-address',
reader: {
type: 'json',
root: 'json-root-value',
idProperty: 'unique-property-in-json-file'
},
writer: {
type: 'json'
}
}
That should set the json mediatype header (assuming that's what your request is expecting).
It can Read the remote database, it can Create new items locally, but they don't actually save to the remote database. This is what adds a new item:
function addNewItem(){
dataSource.add({id:"0", petName:"Dusty", petSpecies:"Dog", petGender:"M"});
dataSource.sync();
}
$('#addPet').bind('click', addNewItem);
This ajax POST call in that function instead of the dataSource stuff adds to my database perfectly:
var object = { id:"0", petName:"Dusty", petSpecies:"Dog", petGender:"M" };
$.ajax({
type: "POST",
url: 'website/petData',
headers: { "Authorization" : "Bearer ${AccessToken}" },
contentType: "application/json",
data: JSON.stringify(object)
})
Here is my datasource code. What do I need to change? I've tried doing sooooo many different things but no luck yet.
var dataSource = new kendo.data.DataSource({
type: "everlive",
transport: {
typeName: 'petData',
read: {
url: "website/petData",
dataType: "jsonp"
},
create: {
url: 'website/petData',
dataType: "jsonp"
}
},
group: "petSpecies",
schema: {
model: {
id: "id",
fields: {
id: { type: "number"},
petName: { type: "text" },
petSpecies: { type: "text" },
petGender: { type: "text" }
}
}
}
});
So thanks to giltnerj0 and Brett's comments, I was able to google the right words, and discovered that all I needed to do was change create's dataType:jsonp to json. I'm getting some POST errors now, but it's POSTing finally and saving things to my database.
create: {
url: 'website/petData',
dataType: "json"
}
i had a simple controller to update my truck list in my db. Iniatially it had been working with jsonP(because my server was in another domain), and it worked fine, but then i had joined the php scripts(to manage crud in db) in the same domain and i had changed to ajax proxy. The problem is that i had noticed although ajax proxy sends POST request... i never get anything... (These never occurs with jsonp, because it sent GET request i think). So, is there anything i had forgotten or i must do?
Let me show my store before and after the upgrade:
BEFORE:
Ext.define('myapp.store.ListaCamiones', {
extend: 'Ext.data.Store',
requires: [
'myapp.model.Camion'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
autoLoad: true,
autoSync: true,
model: 'myapp.model.Camion',
storeId: 'ListaCamiones',
proxy: {
type: 'jsonp',
api: {
read: 'http://myapp.localhost/camion/listar',
write: 'http://myapp.localhostt/camion/guardar/',
update: 'http://myapp.localhost/camion/guardar/',
destroy: 'http://myapp.localhost/camion/eliminar/'
},
url: 'http://myapp.localhost/camion/listar',
reader: {
type: 'json',
root: 'listacamion'
},
writer: {
type: 'json',
root: 'listacamion'
}
}
}, cfg)]);
}
});
AFTER:
Ext.define('myapp.store.ListaCamiones', {
extend: 'Ext.data.Store',
requires: [
'myapp.model.Camion'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
autoLoad: true,
autoSync: true,
model: 'myapp.model.Camion',
storeId: 'ListaCamiones',
proxy: {
type: 'ajax',
url: '/camion/listar',
api: {
read: '/camion/listar',
write: '/camion/guardar/',
update: '/camion/guardar/',
destroy: '/camion/eliminar/'
},
reader: {
type: 'json',
root: 'listacamion'
},
writer: {
type: 'json',
root: 'listacamion'
}
}
}, cfg)]);
}
});
This is what i got from chrome debug:
Connection:Keep-Alive
Content-Length:0
Content-Type:application/x-json
Date:Mon, 01 Jul 2013 15:40:38 GMT
Keep-Alive:timeout=5, max=100
Server:Apache/2.2.22 (Ubuntu)
X-Powered-By:PHP/5.4.9-4ubuntu2
I hope you can help me to understand what is happening . Thank you in advance
try changing your proxy type to 'rest'
I have to do a POST from my ExtJs script in order to delete something from my DB:
Ext.Ajax.request({
url: 'deleteRole.html',
method: 'POST',
headers: {'Content-Type': 'text/html'},
waitTitle: 'Connecting',
waitMsg: 'Sending data...',
params: {
"rolename" : rolename
},
scope:this,
success: received,
failure: function(){console.log('failure');}
});
when the post is sent i can see in the firebug the rolename in font but not as a param. I would like to show you another post (made with spring:form) relative to the user registration. If i inspect the post i can see the following:
(source: subirimagenes.com)
And i can get the parameters in my controller using #RequestParam.
But in the post that i have problems i can't see the parameters part, i can only see the Font(Fuente) part:
(source: subirimagenes.com)
As a consequence, my spring controller does not detect any parameter. Is it something wrong in my POST?
Thank you
The problem is that you are using the line headers: {'Content-Type': 'text/html'}, in your original question. This would set the content to text/html instead of the content being post data.
I solved it with the following code:
var rolename = 'myRol';
Ext.Ajax.request({
url: 'deleteRole.html',
method: 'POST',
params: {
rolename: rolename
},
success: received,
failure: function(){console.log('failure');}
});
I'm using this in a Sencha Touch app. I had to add an extra config called jsonData and make it true or else nothing is passed to my endpoint url.
Ext.Ajax.request({
url: endpoint,
method : "POST",
headers: {
'Content-Type': 'application/json'
},
params : {add: formattedAddress, lat: latitude},
jsonData: true,
useDefaultXhrHeader : false,
withCredentials: true,
success : function(response) {
Ext.Msg.alert("Success", 'yea');
},
failure : function(response) {
var respObj = Ext.JSON.decode(response.responseText);
Ext.Msg.alert("Error", respObj.status.statusMessage);
}
});
I would like to send json data using Ext.Ajax.request() then access it in ASP.NET using Request.InputStream which is the content of the request body. I need a way to tell ExtJs to write the data in the request body as it is done while using an Ext.data.proxy.Ajax.
Specify POST method and just use the request's jsonData config:
Ext.Ajax.request({
url: 'myUrl',
method: 'POST',
params: {
requestParam: 'notInRequestBody'
},
jsonData: 'thisIsInRequestBody',
success: function() {
console.log('success');
},
failure: function() {
console.log('woops');
}
});
If you want a record written as JSON you can use a JSON writer like this also.
var writer = Ext.create('Ext.data.writer.Json'),
record = Ext.getStore('SomeStoreID').first();
Ext.Ajax.request({
url: 'myUrl',
method: 'POST',
params: {
requestParam: 'notInRequestBody'
},
jsonData: writer.getRecordData(record),
success: function() {
console.log('success');
},
failure: function() {
console.log('woops');
}
});