The Ext base forces application/x-www-form-urlencoded as the content type

[dotnetCarpenter]

I know this is a feature but I consider it a bug.
The Ext base will put in application/x-www-form-urlencoded as the content type in XHRs, regardless what you do in Ext.Ajax. The workaround is
Ext.lib.Ajax.request = Ext.lib.Ajax.request.createInterceptor(function(method, uri, cb, data, options){
// here you can put whatever you need as header. For instance:
this.defaultPostHeader = "application/json; charset=utf-8;";
});

Please remove this, as it breaks applications build with ASP.NET AJAX Extensions web services as back end.

Other people have had problems with this as well:
http://extjs.com/forum/showthread.php?t=11469
http://extjs.com/forum/showthread.php?t=5769

Regards, Jon.

[jack.slocum]

This is not a bug, it is by design.

You can change the default with one call globally:

Ext.lib.Ajax.setDefaultPostHeader('your header');

[dotnetCarpenter]

This is not a bug, it is by design.

I thought so... :(

You can change the default with one call globally: Ext.lib.Ajax.setDefaultPostHeader('your header');

Can we have that in the documentation please?

[dotnetCarpenter]

I just tried to use Ext.lib.Ajax.setDefaultPostHeader('your header'); and it doesn't work! I'm not sure why yet.. I'll get back to you.

EXT is a very very cool framework - I haven't had the chance to tell you yet :)

[dotnetCarpenter]

While I have you. Why doesn't the source ext-base.js work? I can see that it doesn't start with Ext = {}; ect. but why?

[dotnetCarpenter]

In the ext-base.js
request : function(method, uri, cb, data, options) {
if(options){
var hs = options.headers;
if(hs){
for(var h in hs){
if(hs.hasOwnProperty(h)){
this.initHeader(h, hs[h], false);

should probably be this.initHeader(h, hs[h], true) or a check of the last argument... It seems that Ext.Ajax.defaultHeaders isn't considered defaultHeaders. Unfortunately I have no way of checking this, because the none minified version won't run (see above post).

[jack.slocum]

The output ext-base.js is a combination of core/Ext.js and adapters/ext-base.js.

[dotnetCarpenter]

Ok, I have this solution that works in my setup:
ext-base.js
Ext.lib.Ajax.request
1451 if(options){
1452 var hs = options.headers;
1453 if(hs){
1454 for(var h in hs){
1455 if(hs.hasOwnProperty(h)){
1456 this.initHeader(h, hs[h], true);

ext-all-debug.js
Ext.Ajax
5150 useDefaultHeaders : function(choice){
5151 test = new Boolean(choice);
5152 try{
5153 if(test.toString() === "true" || test.toString() === "false"){
5154 Ext.lib.Ajax.useDefaultXhrHeader = choice;
5155 Ext.lib.Ajax.useDefaultHeader = choice;
5156 }
5157 }catch(e){
5158 throw e;
5159 }
5160 },
In an ini file you just use this


Ext.Ajax.useDefaultHeaders(false);
Ext.Ajax.defaultHeaders = ({ "Content-Type": "application/json; charset=utf-8;" });

It's easy to loose focus as there is a lot header checking and setting. It seems to me that there is a lot of redundancy.
What do you think Jack?

[mystix]

jack,

In 1.1.1's ext-base.js (taken from SVN), the setDefaultPostHeader is defined as follows


setDefaultPostHeader:function(b)
{
this.useDefaultHeader = b;
}

the initial value of the useDefaultHeader config however, is a boolean.

further down, the useDefaultHeader config is used in the following check in the asyncRequest method


asyncRequest:function(method, uri, callback, postData)
{
var o = this.getConnectionObject();

if (!o) {
return null;
}
else {
o.conn.open(method, uri, true);

if (this.useDefaultXhrHeader) {
if (!this.defaultHeaders['X-Requested-With']) {
this.initHeader('X-Requested-With', this.defaultXhrHeader, true);
}
}

if(postData && this.useDefaultHeader){
this.initHeader('Content-Type', this.defaultPostHeader);
}

if (this.hasDefaultHeaders || this.hasHeaders) {
this.setHeader(o);
}

this.handleReadyState(o, callback);
o.conn.send(postData || null);

return o;
}
}


it seems like the setDefaultPostHeader method is incorrect, and should be this instead


setDefaultPostHeader:function(b)
{
this.defaultPostHeader = b;
}


likewise, the setDefaultXhrHeader method also seems incorrect and should be this instead


setDefaultXhrHeader:function(b)
{
this.defaultXhrHeader = b;
}

[mystix]

[ bump ]
so it gets back on the radar.

[dotnetCarpenter]

I will alter the source and test your code later today. I'll get back...

My solution didn't work as the content-type was added on each AJAX call.

[mystix]

[ yet another shameless bump ]

reported this in the 2.0 bug forum too:
http://extjs.com/forum/showthread.php?t=17025

[brian.moeskau]

I replied here (http://extjs.com/forum/showthread.php?p=145145#post145145) that, according to the original intent, the current code is correct. However, according to Jack's comment above, I'm not sure if the intent should have changed or not from the original YUI code. It seems that according to the current code, to change the default header globally you'd have to do:


Ext.Ajax.defaultPostHeader = "custom header";

And setDefaultPostHeader would still only set whether or not to use that (boolean) but would not affect the value. Jack, maybe you can clarify if this is correct.