Question

So I know that $('#table_content').sortable('serialize') returns an array because I tested it with console.info. What I want to do is use the value of that expression as data in a post request but I want it’s result to be passed as data in a callback to another ajax request. I thought I could do this by just placing $('#table_content').sortable('serialize') as the data argument for .post but when I do this, the parameter is “undefined=undefined” according to firebug.

jQuery ->
  ids = $('#table_content').sortable('serialize')
  console.info(ids)

  $('#tasks_table').load('/dashboard #tasks_table', null, -> $.post('/tasks/sort', $('#table_content').sortable('serialize'), ->location.reload()))

undefined=undefined

Any ideas on why this is happening? Note, that if I pass ids in the place of $('#table_content').sortable('serialize'), it works but I only want to the value of the $('#table_content').sortable('serialize') once the previous ajax request has run. If I just use ids, then it’s value does not reflect the change after calling $('#tasks_table').load

Answer 1

From you example, it seems you end-up with the following structure after loading (maybe not a DIV element of course):

<!-- #tasks_table you call .load() upon -->
<div id="tasks_table"> 
   <!-- #tasks_table that is loaded -->
   <div id="tasks_table">
   </div>
</div>

Be aware that loading page fragments will insert the loaded fragment (including the wrapping element) into the matched set elements, not replace them !

You should probably extract the children of the #tasks_table in the load:

$('#tasks_table').load('/dashboard #tasks_table > *', ... );

---

Not sure about this one but you’ll maybe have to initialize the sortable plugin before calling the ‘serialize’ method on the loaded content.

$('#tasks_table').load('/dashboard #tasks_table', null, function() {
    var ids = $('#table_content')
        .sortable() // init first
        .sortable('serialize'); // then call 'serialize'
    $.post('/tasks/sort', ids, function() {
        location.reload()
    });
});