1

Jquery Code

    $(function() {
$("#list .sections").sortable({ opacity: 0.5, cursor: 'move',update: function() {

        var order = $(this).sortable("serialize") + '&update=order';

                    $('#form').submit(function()
                    {
                        $.ajax
                        ({
                            type: "POST",
                            url: "update.php",
                            data: order,
                            success: function()
                            {
                            alert(success)
                            }
                        });                        
                    });

    }                                 
    });
});

HTML and PHP Code

      <form action="" method="post" id="form">  
  <div id="list">
    <div class="sections">
    <div id="response"> </div>

      <?php
        include("connection.php");
        $query  = "SELECT * FROM dragdrop ORDER BY listnumber ASC";
        $result = mysql_query($query);
        while($row = mysql_fetch_array($result, MYSQL_ASSOC))
        {
            $id = stripslashes($row['id']);
            $text = stripslashes($row['text']);
        ?>

      <div id="listOrder_<?php echo $id ?>" class="box_inner">
          <div id="section_head">
            <?php echo $text?>  
            <span class="id"><?php echo $id; ?></span>
                            <input type="hidden" name="value" value="need value" />
          </div>
          <div id="section_body">
                            <h2> Drag Me </h2>
          </div>
      </div>
      <?php } ?>

    </div>
          <input type="submit" id="save_element" value="Save element" style="margin-left: 40px" />
        </div>
      </form>

My question is how to get all value under listOrder_ id with serialize?

I have try like

var value = $('input[name="value"]').val();

$.(value).sortable("serialize");

but can't get it work, please help me

Thank you

1
  • can you paste your update code? what results are you getting? Sep 2, 2012 at 5:40

1 Answer 1

0

You don't need to use a form and hidden fields.

Sample Markup:

<div id="container">
    <span data-name="a"></span>
    <span data-name="b"></span>
    <span data-name="c"></span>
  </div>

Script:

<script>
var obj = {};
$('#container span').each(function(index){
    var name = $(this).data('name');
    obj[index] = [];
    obj[index] = {'name' : name};
});
</script>

$.post('update.php', {'data' : obj}); //update list

If you only want to store one type of data in each row then you can just use an array and push to it in the loop.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.