6

Hoping that using something like this demo it is possible to drag items within and between two columns, and update their order either live or with a "save" button to MySQL. Point being that you can make changes and return to the page later to view or update your ordering.

http://pilotmade.com/examples/draggable/

Doing it for just one column is fine, but when I try to pass the order of both columns, the issue seems to be passing multiple serialized arrays with jQuery to a PHP/MySQL update script.

Any insight would be much appreciated.

If you look below, I want to pass say...

sortable1
entry_1 => 0
entry_5 => 1

sortable2
entry_3 => 0
entry_2 => 1
entry_4 => 2

EDIT: This ended up doing the trick

HTML

<ol id="sortable1"><li id="entry_####">blah</li></ol>

jQuery

<script type="text/javascript">
$(function() 
{
    $("#sortable1, #sortable2").sortable(
    {
        connectWith: '.connectedSortable',
        update : function () 
        { 
            $.ajax(
            {
                type: "POST",
                url: "phpscript",
                data: 
                {
                    sort1:$("#sortable1").sortable('serialize'),
                    sort2:$("#sortable2").sortable('serialize')
                },
                success: function(html)
                {
                    $('.success').fadeIn(500);
                    $('.success').fadeOut(500);
                }
            });
        } 
    }).disableSelection();
});

This is the PHP query

parse_str($_REQUEST['sort1'], $sort1);
foreach($sort1['entry'] as $key=>$value)
{
do stuff
}
noahkuhn
  • 199
  • 1
  • 2
  • 11
  • can we see your code so we can see where you went wrong ? – mcgrailm Mar 24 '10 at 17:57
  • I edited to show the jQuery & html code. I guess my question is really about how to pass the serialized data from this to the php insert/update script. – noahkuhn Mar 24 '10 at 18:02
  • where exactly are you having a problem is serialized data not formatted right or are you just not sure how to get the posted data into your database ? – mcgrailm Mar 24 '10 at 18:06

1 Answers1

7

what I would do is split them up 

   data    :
    {
      sort1:$('#sortable1').sortable('serialize'),
      sort2:$('#sortable2').sortable('serialize')
    }

then when you post you can get the request and set them as needed, I hope that makes sense

so what I do is this

parse_str($_REQUEST['sort1'],$sort1); 

foreach($sort1 as $key=>$value){
    //do sutff;
}
mcgrailm
  • 17,469
  • 22
  • 83
  • 129
  • this makes sense, re: your question above about my problem, I guess now that I know I can split the serialized data into two segments, do they now get passed as $_POST['sort1'] and $_POST['sort2'] ? I "think" if that works I should be all set. Thanks for the quick response. – noahkuhn Mar 24 '10 at 18:21
  • One final question... is the correct loop to get the arrays values for inserting into the db: foreach($_POST['sort1'] as $key=>$value) { do this } Thought I understood how this should work... – noahkuhn Mar 24 '10 at 18:31
  • That did the trick, everything is working, thanks for making my day mmcgrail! – noahkuhn Mar 24 '10 at 19:03