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 comment:1
Changed October 15, 2012 02:36PM UTC by comment:2
owner: | → Mamen |
---|---|
status: | new → pending |
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 comment:3
status: | pending → new |
---|
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 comment:4
resolution: | → wontfix |
---|---|
status: | new → closed |
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 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 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 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 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 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 comment:10
#9215 is a duplicate of this ticket.
Changed April 08, 2013 02:17AM UTC by 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 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 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 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.
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 adata
property, it'll get ignored, so as you wrote, modifying theurl
directly is the only way to add data.We should consider doing the settings-merging earlier, directly in tabs code instead of using
beforeSend
.