jqueryソート可能データベースへの保存が正常に動作しない

Question

jqueryソート可能な機能を私のウェブサイトに組み込み、データベース内の位置を保存することで多少の頭痛を与えている...私は3日間これを戦ってきた今、私はこの仕事を適切にすることができません。

それは、データベースの位置を保存していますが、期待する順序や位置ではありません。つまり、アイテムをポジション0からポジション1に移動すると、ポジションはdb内の別の順序で保存されます。ライブバージョンhereをチェックしてください。ここで

は...私のコードです

index.phpファイル：

<div id="container"> 
    <?php 
     require_once 'conn.php'; 
     $q = ' SELECT * FROM items WHERE groupId = 3 ORDER BY position '; 
     $result = mysqli_query($db, $q); 
     if ($result->num_rows > 0) { 
     while($items = $result->fetch_assoc()) { 
     ?> 
     <div id='sort_<?php echo$items['position'] ?>' class='items'> 
     <span>&#9776;</span> <?php echo$items['description'] ?> 
     </div> 
     <?php 
     } 
     } 
    ?> 
</div> 

js.jsファイル：

$("#container").sortable({ 
    opacity: 0.325, 
    tolerance: 'pointer', 
    cursor: 'move', 
    update: function(event, ui) { 
     var itId = 3; 
     var post = $(this).sortable('serialize'); 

     $.ajax({ 
     type: 'POST', 
     url: 'save.php', 
     data: {positions: post, id: itId }, 
     dataType: 'json', 
     cache: false, 
     success: function(output) { 
      // console.log('success -> ' + output); 
     }, 
     error: function(output) { 
      // console.log('fail -> ' + output); 
     } 
     }); 

    } 
}); 
$("#container").disableSelection(); 

save.phpファイル：

require_once('conn.php'); 

$itId = $_POST['id']; 
$orderArr = $_POST['positions']; 
$arr = array(); 
$orderArr = parse_str($orderArr, $arr); 
$combine = implode(', ', $arr['sort']); 

$getIds = "SELECT id FROM items WHERE groupId = '$itId' "; 
$result = mysqli_query($db, $getIds); 

foreach($arr['sort'] as $a) { 
    $row = $result->fetch_assoc(); 
    $sql = " UPDATE items 
      SET position = '$a' 
      WHERE id = '{$row['id']}' "; 
    mysqli_query($db, $sql); 
} 

echo json_encode(($arr['sort'])); 

誰かが間違っている場所を指摘してくれるの？ この？

ありがとうございます。

セルジュ

Answer 1

場合、誰かがここに土地、ここ

NOTE ...私の場合で働いていたものです：私はindex.phpの選択機能に準備された文を作成しませんでした。しかし、あなたはおそらくすべきです。

index.phpファイル：

<div id="container"> 
     <?php 
     require_once 'conn.php'; 
     $q = ' SELECT * FROM items WHERE groupId = 3 ORDER BY position '; 
      $result = mysqli_query($db, $q); 

     if ($result->num_rows > 0) { 

      while($items = $result->fetch_assoc()){ 
     ?> 
       <div id='sort_<?php echo $items['id'] ?>' class='items'> 
        <span>&#9776;</span> <?php echo $items['description'] ?> 
       </div> 
     <?php 
      } 
     } 
     ?> 
    </div> 

jQueryのソート可能なファイル：

var ul_sortable = $('#container'); 

    ul_sortable.sortable({ 
     opacity: 0.325, 
     tolerance: 'pointer', 
     cursor: 'move', 
     update: function(event, ui) { 
     var post = ul_sortable.sortable('serialize'); 

     $.ajax({ 
      type: 'POST', 
      url: 'save.php', 
      data: post, 
      dataType: 'json', 
      cache: false, 
      success: function(output) { 
       console.log('success -> ' + output); 
      }, 
      error: function(output) { 
       console.log('fail -> ' + output); 
      } 
     }); 

     } 
    }); 
    ul_sortable.disableSelection(); 

更新PHPファイル：

$isNum = false; 

foreach($_POST['sort'] as $key => $value) { 
    if (ctype_digit($value)) { 
     $isNum = true; 
    } else { 
     $isNum = false; 
    } 
} 

if(isset($_POST) && $isNum == true){ 
    require_once('conn.php'); 
    $orderArr = $_POST['sort']; 
    $order = 0; 
    if ($stmt = $db->prepare(" UPDATE items SET position = ? WHERE id=? ")) { 
     foreach ($orderArr as $item) { 
      $stmt->bind_param("ii", $order, $item); 
      $stmt->execute(); 
      $order++; 
     } 
     $stmt->close(); 
    } 
    echo json_encode( $orderArr); 
    $db->close(); 
} 

Answer 2

変更するには、このようなあなたのJSコード：この$.eachループで

{...} 
    tolerance: 'pointer', 
    cursor: 'move', 
// new LINE 
    items: '.items', // <---- this is the new line 
    update: function(event, ui) { 
     var itId = 3; 
     var post = $(this).sortable('serialize'); // it could be removed 
// new LINES start 
     var post={},count=0; 
     $(this).children('.items').each(function(){ 
     post[++count]=$(this).attr('id'); 
     }); 
// new LINES end 
     $.ajax({ 
{...} 

あなたvar post -> serializeを上書きして、独自のソート順を定義します。 PHP print_r($_POST["positions"]);であなたの$ _POST ["positions"]を見て、自分のポジションをあなた自身が持っています。