Question

目前我正在构建一个站点，其中一个功能是创建列表的功能，然后您可以添加指向特定列表的链接。列表将包含许多链接。

我想通过简单地将weight元素拖放到新位置，然后通过ajax调用使用链接li更新数据库，按weight订购链接列表。

查看文件

<ul id="links_list">
<?php

if($links->num_rows() >= 1){

    $i = 0;

    foreach($links->result_array() as $link){

        echo "<li class=\"list_item-".$i."\">";
        echo ''.$link['title'].'<br><br>';
        echo "</li>";

        $i++;
    }

}else{

    echo "You have not yet added any links to this list.";

}

?>
</ul>

我知道这不是很多，但不确定如何完成这个或从哪里开始。

非常感谢任何帮助。

Answer 1

我最终想出了解决这个问题的方法，如下所示。

视图

<ul id="links_list" class="sortable">
<?php

if($links->num_rows() >= 1){

    $i = 0;

    foreach($links->result_array() as $link){

        echo "<li id=\"list_item-".$link['id']."\">";
        echo ''.$link['title'].'<br><br>';
        echo "</li>";

        $i++;
    }

}else{

    echo "You have not yet added any links to this list.";

}

?>
</ul>

的jQuery

$("#links_list").sortable(
{
    connectWith: '.sortable',    
    update : function () 
    { 
        $.ajax(
        {
            type: "POST",
            url: base_url + "links/reorder",
            data: 
            {
                links: $("#links_list").sortable('serialize')              
            },
            success: function(html)
            {
                html;
            }
        });
    } 

}).disableSelection();

链接/重新排序php脚本

public function reorder(){

    parse_str($this->input->post('links'), $links); 

    foreach($links['list_item'] as $key => $value){

        $this->db->set('weight', $key);
        $this->db->where('id', $value);
        $this->db->update('links');

    }

}

希望这有助于某人。

Answer 2

我建议使用jquery ui sortable。您可以附加到其中一个事件，例如change，以便在进行更改时获取列表，并向服务器发送ajax调用以进行保存

使用ajax拖放功能重新排序列字段？ PHP / jQuery的

2 个答案: