1

これについて少し助けを求めてください:

作成中の調査にドラッグ アンド ドロップの並べ替え機能を実装しましたが、ユーザーが並べ替えた後、リストの順序をサーバーに送信する方法がわかりません。

並べ替え用の JS は次のとおりです。

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<script>
$(function() {
$(  "#sortable"  ).sortable();
$(  "#sortable"  ).disableSelection();
});
</script>

そしてhtml:

<ol id="sortable">
<li><label for=""><input type="checkbox" name="resortable-option1" value="1">Option 1</label></li>
<li><label for=""><input type="checkbox" name="resortable-option2" value="2">Option 1</label></li>
<li><label for=""><input type="checkbox" name="resortable-option3" value="3">Option 1</label></li>
<li><label for=""><input type="checkbox" name="resortable-option4" value="4">Option 1</label></li></ol>
4

2 に答える 2

3

次のようなものを試してください。

$("#sortable").sortable({
      stop: function (event, ui) {

            //Serializes the sortable's item id's into an array of string
            var senderStrIndexArray = $(this).sortable("toArray");

            $.ajax({
                 type: "POST",
                 url: '...',
                 data: { senderOrderedServicesIds: senderStrIndexArray },
            });
      }           
});

$(  "#sortable"  ).disableSelection();

アイテムのsort-indexを含む配列を送信してから、データベースに書き込むことができます。

于 2013-02-22T14:13:55.667 に答える
1

フォームを使用してPHPに送信する例を次に示します。

アクションページ:

 <?php
    if(isset($_POST["resortable-option"])){
       foreach($_POST["resortable-option"] as $item){
         echo $item."<br>";
       }
    }
 ?>

HTMLフォーム:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<script>
   $(function() {
      $(  "#sortable"  ).sortable();
      $(  "#sortable"  ).disableSelection();
   });
</script>
<form action="ActionPage" method="post">
   <ol id="sortable">
   <li><label for=""><input type="checkbox" name="resortable-option[]" value="1">Option 1</label></li>
   <li><label for=""><input type="checkbox" name="resortable-option[]" value="2">Option 2</label></li>
   <li><label for=""><input type="checkbox" name="resortable-option[]" value="3">Option 3</label></li>
   <li><label for=""><input type="checkbox" name="resortable-option[]" value="4">Option 4</label></li></ol>
   <input type="submit" value="send">
</form>
于 2013-02-22T14:25:01.740 に答える