基于jquery sortable

时间:2017-06-19 21:31:36

标签: php jquery mysql jquery-ui-sortable

我正在使用jquery sortable并尝试将这些项目的位置保存到名为“position”的mysql表的行中。我似乎无法让他们正确保存/更新。一切都在jquery方面正常工作,只是php更新功能。现在它将位置行保存为3,这就是为什么。我似乎无法理解如何正确地做到这一点。

以下是我对PHP的看法:

$id = $_POST['id'];
$arr = $_POST['positions'];

foreach($arr as $r) {
   $sql = " UPDATE items
            SET   position = '$r'
            WHERE groupId = '$id' ";
}

表格结构/所需输出:

id | groupId | position
----------------------------
3    10       0
6    8        -
8    10       3
10   5        -
15   10       2
18   10       1

jQuery文件:

$("#items").sortable({
      update: function() {
         var invId = $("input[name='deleteId']").val();
         var post = $(this).sortable('serialize');

         $.ajax({
            type: 'POST',
            url: 'file.php',
            data: { positions: post, id: invId },
            dataType: 'JSON',
            cache: false,
            success: function(output) {
               console.log('success');
            },
            error: function(output) {
               console.log('fail ');
            }
         });
      }
   });

感谢。

4 个答案:

答案 0 :(得分:0)

您的查询每次循环都会使用groupId = 10更新所有行,所以最后它们都将包含数组最后一个元素的值。

您需要编写一个查询,该查询获取表中每个匹配行的行号,然后仅更新该行。您可以使用用户定义的变量来增加行号。

UPDATE items AS i1
JOIN (SELECT id, @rownum := rownum + 1 AS rownum
      FROM (SELECT id
            FROM items
            WHERE groupId = '$id'
            ORDER BY id) AS i
      CROSS JOIN (SELECT @rownum := 0) AS var) AS i2
ON i1.id = i2.id
JOIN (SELECT 1 AS target, 0 AS val
      UNION ALL
      SELECT 2, 3
      UNION ALL
      SELECT 3, 2
      UNION
      SELECT 4, 1) AS newpos
ON newpos.target = i2.rownum
SET i1.position = newpos.val

答案 1 :(得分:0)

我认为可能是我遗漏了一些东西,但也许你应该根据与特定组ID匹配的id更新items表。像这样:

{{1}}

我假设您使用mysqli连接到您的数据库。

答案 2 :(得分:0)

jQuery Sortable应该已经发布数据,其中值是行ID,键是订单。这样,你可以做一个foreach循环。假设以下数据:

//$_POST (use chrome inspector to see what post data is being sent)
//positions[] = 3
//positions[] = 18  
//positions[] = 15  
//positions[] = 8  

// note: use a prepared statement, this is just to demonstrate the query.
foreach($_POST['positions'] as $i => $id) {
    $db->query('update table set position = ? where id = ? ',array($i, $id));
}

答案 3 :(得分:0)

如果有人在这里遇到类似的问题,这对我有用。

更新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('con.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();
}

JQUERY SORTABLE FILE:

var sortable = $('#items');
   sortable.sortable({
      opacity: 0.325,
      tolerance: 'pointer',
      cursor: 'move',
      update: function(event, ui) {
         var post_data = sortable.sortable('serialize');

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

      }
   });
   sortable.disableSelection();