What could possibly be causing a 406 on an identicaly .json post call?
-
19-06-2021 - |
Pregunta
I'm using a heavy javascript based app that uses a drag and drop feature.
It works well. But if I add a dynamic object to the page ( which has the exact same attributes and variables as the other objects ), it drags, but on drop, the POST returns a 406.
I'm completely unsure of what could be happening here, as I reinstantiate any environment listeners that could be needed before this call is made. I've broken down the call to this:
Where .cranbar
is a working pre-existing object. I switch it with an identicaly .foobar
which is a dynamically added one, and it returns a 406.
attrs = { _method:"put"};
box = $(".cranbar");
$.post(box.attr('data-update_path'), attrs, function(data) {
});
This snippet comes from the make_droppable
method that is loaded after the object is instantiated and before I make an attempt to drag and drop it.
make_droppable: function(){
$('table#week .day').droppable({
accept: '.job, .task',
hoverClass: 'droppable-hover',
drop: function(e, ui) {
if (confirmOnDrop){
if (!confirm('Are you sure?')) {
if ($('table#week').length > 0) {
draw_weekly_calendar();
}
return false;
}
}
var box = $(ui.draggable);
// var old_container = box.parents('td:first');
var new_cell = $(this);
var new_container = $(this).find('.rel_box');
// add indicator
box.addClass('indicator');
// add box to new container
box.attr('style', 'position: absolute;').appendTo(new_container);
var attrs = null;
if (box.attr('data-object-type') == 'job') {
// update job already on screen
attrs = {
'job[scheduled_on]': new_cell.attr('data-scheduled_on'),
'_method': 'put'
}
}
else if (box.attr('data-object-type') == 'task') {
attrs = {
'task[scheduled_at]': new_cell.attr('data-scheduled_on'),
'_method': 'put'
}
}
if (attrs) {
$.v = attrs;
$.post(box.attr('data-update_path'), attrs, function(data) {
box.removeClass('indicator');
box.attr('data-scheduled_at', new_cell.attr('data-scheduled_on'));
draw_weekly_calendar();
});
}
// nice effect
box.effect('shake', { times: 1, distance: 2 }, 50);
}
});
},
Does anyone know what I can do to find the source of this 406?
UpdatE
This probably has a lot to do with it. But I'm comparing headers now.
Failing Post :
Response Headers
Cache-Control no-cache
Connection Keep-Alive
Content-Length 1
Content-Type text/html; charset=utf-8
Date Mon, 09 Jul 2012 16:11:27 GMT
Server WEBrick/1.3.1 (Ruby/1.9.2/2011-02-18)
Request Headers
Accept text/javascript
Accept-Encoding gzip, deflate
Accept-Language en-us,en;q=0.8,es-es;q=0.5,es;q=0.3
Connection keep-alive
Content-Length 57
Content-Type application/x-www-form-urlencoded; charset=UTF-8
Successful Post:
Response Headers
Cache-Control max-age=0, private, must-revalidate
Connection Keep-Alive
Content-Length 2024
Content-Type application/json; charset=utf-8
Date Mon, 09 Jul 2012 16:11:35 GMT
Etag "93432c11e3cc55dfec8e0aee7c08bcc1"
Server WEBrick/1.3.1 (Ruby/1.9.2/2011-02-18)
Request Headers
Accept text/javascript
Accept-Encoding gzip, deflate
Accept-Language en-us,en;q=0.8,es-es;q=0.5,es;q=0.3
Connection keep-alive
Content-Length 57
Content-Type application/x-www-form-urlencoded; charset=UTF-8
Solución
Seems to me that the issue is the Content-Type
of the resposne header. It's using text/html
, but expects application/json
. This causes a 406 error because, although the data was successfuly queried, it's not a response that's valid -> 406. I honestly don't know if you can change the contentType
with inthe $.post params, but you can do it with .ajax()
.
$.ajax({
type: 'POST',
url: box.attr('data-update_path'),
contentType: 'application/json; charset=utf-8',
data: attrs,
success: function(data){
box.removeClass('indicator');
box.attr('data-scheduled_at', new_cell.attr('data-scheduled_on'));
draw_weekly_calendar();
}
});
Hopefully this resolves your problem.