Skip to main content

Search and Top Navigation

#8673 closed bug (wontfix)

Opened October 15, 2012 08:46AM UTC

Closed October 15, 2012 07:46PM UTC

Last modified October 21, 2013 09:13PM UTC

Tabs: setting data in beforeLoad doesn't work

Reported by: Mamen Owned by: Mamen
Priority: minor Milestone: 1.10.0
Component: ui.tabs Version: 1.9.0
Keywords: Cc:
Blocked by: Blocking:
Description

In earlier versions additional data could be sent with data parameter. With increased control of ajaxSettings and jqXHR, this should be easier now. But it doesn't work. Consider the following code:

$("#tabs").tabs({
	beforeLoad: function(event, ui){
		//To add additional data
		ui.ajaxSettings.data.foo = "bar";
		//OR overwrite all data
		ui.ajaxSettings.data = {foo: "bar"};
	}
});

As a work around you could write this:

$("#tabs").tabs({
	beforeLoad: function(event, ui){
		ui.ajaxSettings.url += "&foo=bar";
	}
});

However the latter has several disadvantages, and may not work without additional code. (Such as checking if & or ? should be used)

Attachments (0)
Change History (14)

Changed October 15, 2012 02:33PM UTC by jzaefferer comment:1

The new implementation uses jQuery's beforeSend callback under the hood, which runs after most of the data processing that jQuery's ajxa method does. So while you can add a data property, it'll get ignored, so as you wrote, modifying the url directly is the only way to add data.

We should consider doing the settings-merging earlier, directly in tabs code instead of using beforeSend.

Changed October 15, 2012 02:36PM UTC by scottgonzalez comment:2

owner: → Mamen
status: newpending

We can't do merging earlier without adding another event since we need to get the jqXHR instance for this event to actually be useful.

@Mamen: What is your actual use case for modifying the data?

Changed October 15, 2012 04:52PM UTC by Mamen comment:3

status: pendingnew

Since I have similar data in across several tabs, I need to get information about which tab I am in. This is due to scoping/prefixing.

Changed October 15, 2012 07:46PM UTC by petersendidit comment:4

resolution: → wontfix
status: newclosed

There is away to handle this use case. And jQuery.params(); can help you if you want to use an object rather than a string for your data. Yes handling the ? and & is a little more work, but the use case is pretty rare.

Changed November 23, 2012 11:41PM UTC by moony comment:5

This workaround only works for GET-requests. In my case I have many data to send to the server. With the workaround the URL will be too long. The only way is to use the data parameter with a POST request.

Changed November 25, 2012 12:58AM UTC by scottgonzalez comment:6

Sounds like an edge case to me. Write an extension if you need to use POST.

Changed December 05, 2012 02:50PM UTC by raysewell comment:7

I'm not sure how rare the use case is. I had a similar issue: I have form fields on my tabs that allow users to enter lots of data. With all of that data in the URL, the server will reject the request. I was able to work around this by extending the tabs function (as suggested) and using $.ajaxPrefilter to set the data. I would, however, vote for fixing this, if possible. If not, then the documentation should be updated to say that the data field cannot be updated and pointing to this workaround. Are there other Ajax options that cannot be updated here?

Changed December 05, 2012 02:57PM UTC by scottgonzalez comment:8

@raysewell Possibly, these are definitely outside of the scope of tabs core though. Write an extension if you need more control.

Changed January 28, 2013 01:46PM UTC by DysprosiumDy comment:9

Seems pretty counterintuitive to get the ajaxSettings object and its data property only to find out using it is useless. Took me quite some time today to figure out why my code wasn't working. We're upgrading our entire webservice to 1.10 and this seemed very odd. Could you possibly document this in the API? Might save some people a few hours of frustration.

Changed April 08, 2013 01:35AM UTC by tj.vantoll comment:10

#9215 is a duplicate of this ticket.

Changed April 08, 2013 02:17AM UTC by Abdul Narayan comment:11

There are also non-trivial security implications. Please read here for more details : http://blog.httpwatch.com/2009/02/20/how-secure-are-query-strings-over-https/

It is not as simple as converting form data into query arguments. Often times there are access-tokens or session information, as you can imagine when flipping between tabs. You are essentially forcing users to pass that on URL and have it logged on 3rd party hosting services..

Changed April 08, 2013 12:26PM UTC by scottgonzalez comment:12

We're not forcing anything. Tabs provides the necessary events for you to implement any behavior you want, including POST Ajax requests. You just won't be able to use the built-in Ajax support.

Changed April 25, 2013 05:40PM UTC by mattpratt comment:13

This is the hack I came up with to get jQuery to send the post data:



beforeLoad: function( event, ui ) {
   ui.ajaxSettings.type = 'POST'; 
   ui.ajaxSettings.hasContent = true;
   ui.jqXHR.setRequestHeader( "Content-Type", ui.ajaxSettings.contentType );
   ui.ajaxSettings.data = jQuery.param( { foo: 'bar'}, ui.ajaxSettings.traditional );
}

Changed October 21, 2013 09:13PM UTC by jennifer.mankin@gmail.com comment:14

The "hack" provided above doesn't actually work for POST operations...

You can use $.ajaxPrefilters(). Could get hairy for complex solutions, perhaps, but definitely workable.

http://jsfiddle.net/evuZz/7/