i'm using extjs4 store
In xhtpp calls it shows the http://localhost/home_dir/index.php/questions/content_pie?_dc=1312366604831&hi=&page=1&start=0&limit=25
This is the store code
var content_type_store = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: BASE_URL+'questions/content_pie',
method:'POST',
params :{hi:''}
}),
reader: new Ext.data.JsonReader({
root: 'results'
}, [
'qtype',
'qval'
])
});
Even though i set the method as POST its get params appears in url
I'm using codeigniter as my framework. I disabled GET params in CI. Iwnat to send params in post. with ext2 and 3 this code worked fine..
Help me
Thanks
method:'POST' in proxy's config won't work. There is no such config option. However there are two ways to make store use POST. The simplier one - just override getMethod function:
var content_type_store = new Ext.data.Store({
proxy: {
type: 'ajax',
url: BASE_URL+'questions/content_pie',
extraParams :{hi:''},
// Here Magic comes
getMethod: function(request){ return 'POST'; }
},
reader: {
type: 'json',
root: 'results'
}
});
The second way: override proxy's actionMethods property. If you choose this way your proxy should look like this:
// ...
proxy: {
type: 'ajax',
url: BASE_URL+'questions/content_pie',
extraParams :{hi:''},
// Here Magic comes
actionMethods: {
create : 'POST',
read : 'POST',
update : 'POST',
destroy: 'POST'
}
},
// ...
Related
I am required to use Ext.Store not Ext.Ajax as my requirement. Here is my code:
Ext.define('Vidly.store.Customers', {
extend: 'Ext.data.Store',
alias: 'store.customers',
storeId: 'customers',
model: 'Vidly.model.Customer',
autoLoad: true,
proxy: {
type: 'ajax',
headers : {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'POST, GET, OPTIONS, DELETE, PUT',
'Access-Control-Allow-Headers': 'x-requested-with, Content-Type, origin, authorization, accept, client-security-token'
},
api : {
read : 'https://localhost:44378/api/Customers'
},
reader: {
type: 'json',
}
}
});
I keep getting this error: XMLHttpRequest at 'https://localhost:44378/api/Customers?_dc=1612003742512&page=1&start=0&limit=25' from origin 'http://localhost:1967' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I am not sure if I should adjust something on my API or on my SPA but I already removed all CORS related code plus it works on my other SPA.
EDIT
Here is my .NET 5 API Startup under ConfigureServices method
services.AddCors();
and under Configure method
app.UseCors(options => options.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod());
I was able to resolve the issue by changing my Ext Store call for some reason it is sending default headers that the API rejects. The video guides in the internet uses my previous syntax, luckily I found a better syntax that overrides the default headers.
Here is the code
Ext.define('Vidly.store.Customers', {
extend: 'Ext.data.Store',
alias: 'store.customers',
storeId: 'customers',
model: 'Vidly.model.Customer',
autoLoad: true,
proxy: {
type: 'rest',
url: 'https://localhost:44313/api/Customers',
useDefaultXhrHeader: false,
reader: {
type: 'json',
headers: { 'Accept': 'application/json' },
}
}
});
Using type as rest not ajax. Hope this helps others. Thanks.
I have been trying to do a post request using a proxy. I have tried the direct proxy, rest and ajax proxy, and haven't been able to find a working example for a POST request.
Is it possible? Because all the examples that I have seen seen to be using only GET.
Any working examples, or pointers in this direction?
Also, I couldn't figure what is the correct way to generate URLs for a proxy at run-time, for example, calling a function to return the URL.
It appears that this might not be possible:
http://www.sencha.com/forum/showthread.php?205557-Using-Ext.data.proxy.Ajax-via-a-POST-with-jsonData
If you look at the source code for Ext.data.proxy.Rest you'll see a config object for actionMethods. They're not documented, but you should be able to pass that as a config on your proxy to override it.
For example:
proxy: {
type: 'ajax',
url: 'path/to/foo',
actionMethods: {
create : 'POST',
read : 'POST',
update : 'PUT',
destroy: 'DELETE'
},
reader: {
type: 'json',
rootProperty: 'root',
totalProperty : 'totalCount'
}
}
Easiest example of POST request could be like this:
var obj = new Object();
obj.userId = username;
obj.password = password;
var data = Ext.JSON.encode(obj);
Ext.Ajax.request({
url : 'http://myservice/auth/login?_type=json', // url : this.getUrl(),
method : "POST",
headers: {
'Content-Type': 'application/json'
},
params : data,
useDefaultXhrHeader : false,
withCredentials: true,
success : function(response) {
Ext.Msg.alert("Success", "Welcome "+respObj.user.name);
},
failure : function(response) {
var respObj = Ext.JSON.decode(response.responseText);
Ext.Msg.alert("Error", respObj.status.statusMessage);
}
});
Please note here you can customize url as per your convenience.
I am just learning sencha touch. I am trying to retrieve data form a server (following the getting started example). I am trying to print the response to the console in a success callback. Here is the code I am attempting to use, but nothing is being printed to the console.
proxy: {
type: 'jsonp',
url: 'https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=http://feeds.feedburner.com/SenchaBlog',
reader: {
type: 'json',
rootProperty: 'responseData.feed.entries'
},
listeners: {
success: function(response) {
console.log(response)
}
}
so, what is the proper syntax for a success callback so that I can do some stuff with the response like print it in the console?
Thanks!
Change this
rootProperty: 'responseData.feed.entries'
for this:
root: 'responseData.feed.entries'
Or could you change proxy: {type: 'jsonp' ... } for proxy: {type: 'ajax' ... } plus above.
I hope these helps.
I would like to know how to use the api attribute of a proxy in ST2
For now, I have this in my proxy configuration:
api: {
create : App.urls.create_object,
read : App.urls.load_object,
update : App.urls.update_object,
destroy : App.urls.destroy_object
}
But then, I don't know how to use it.
For instance, when I wanted to create a new object, I created an Ext.Ajax.request with these parameters :
url: App.urls.create_object,
params: {
'object': object
},
But now, how could I do the same with the api attribute ?
Could you help ?
Assuming you have a model like this:
Ext.define('User', {
fields: ['name', 'email'],
proxy: {
type: 'ajax',
api: {
create: 'my_create_url',
read: 'my_read_url',
update: 'my_update_url',
destroy: 'my_destroy_url'
}
}
});
create
var user = Ext.create('User', {name: 'Ed Spencer', email: 'ed#sencha.com'});
user.save(); // will POST to the create url
update
var user = Ext.create('User', {name: 'Ed Spencer', email: 'ed#sencha.com'});
user.save({
success: function(user) {
user.set('name', 'Robert Dougan');
user.save(); // will PUT update URL
}
});
read
Using a store:
var store = Ext.create('Ext.data.Store', {
model: 'User'
});
store.load(); // will GET to read URL
Using the model:
// will GET the read URL with the specified ID.
User.load(12, {
success: function(user) {
console.log(user);
}
});
destroy
var user = Ext.create('User', {name: 'Ed Spencer', email: 'ed#sencha.com'});
user.save({
success: function(user) {
user.destroy(); // will DELETE destroy URL
}
});
There is more information about this on the Rest proxy in the Sencha Docs: http://docs.sencha.com/touch/2-0/#!/api/Ext.data.proxy.Rest
sync
You can also use the store sync method to batch create/update/destroy all the records in your store.
var store = Ext.create('Ext.data.Store', {
model: 'User'
});
store.add({ name: 'Robert Dougan', email: 'rob#sencha.com' });
store.sync(); // will batch update all the needed records
I am trying to communicate with RIA service from extjs using POST for getting response with following code.
var store = Ext.create('Ext.data.Store', {
model: 'RootResults',
proxy: {
type: 'ajax',
actionMethods: 'POST',
url: 'MyService.svc/JSON/GetRes',
headers: {
'Content-type': 'application/json'
},
reader: {
type: 'json',
root: 'GetResResult.RootResults',
totalProperty: 'GetResResult.TotalCount'
}
, pageParam: undefined,
startParam: undefined,
limitParam: undefined
, success: function (response) {
alert(response);
}
}
});
var operation = new Ext.data.Operation({
FId: 1,
SId: 0
});
store.load({ params: Ext.encode(operation) });
i can access it with get.
when i am trying with POST, it returning error - "405 Method Not Allowed".
what to do to make it POST enabled?
When i asked this question, i am bit confused with POST communication between extjs and RIA services.
I solved this with the help of following article
http://www.joseph-connolly.com/blog/post/WCF-RIA-Services-jQuery-and-JSON-endpoint-Part-2.aspx
For accessing WCF RIA Services from jquery or extjs, actually we need to create changeset for CUD(Create-Update-Delete) operations and All of the operations use JSON/SubmitChanges.
I believe that on the server end you need to add HasSideEffects to your method declaration ():
[Invoke(HasSideEffects = true)]
public GetPages(...)
{
}