Bonfire Forums

Nevermind, I got it working :D

simple example:

in your view: (in my case module page: views/content/index.php)

<ul id="sortable">
    <li id="1">Item 1</li>
    <li id="2">Item 2</li>
    <li id="3">Item 3</li>
</ul>

in your js.php:

$(document).ready(function(){
    $('#sortable').sortable({
        update: function() {
            var stringDiv = "";
            $("#sortable").children().each(function(i) {
                var li = $(this);
                stringDiv += " "+li.attr("id") + '=' + i + '&';
            });

            $.ajax({
                type: "POST",
                url: "<?=base_url().'/admin/content/page/updateOrder'?>",
                data: stringDiv

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

In your controller: (in my case controllers/content.php)

    function updateOrder () {

        $data =  $this->page_model->getOrderList() ;

        foreach ( $_POST as $key => $value )
        {
            $newRank = $value;
            $currentRank = $data[$key];
            if($currentRank != $newRank){
                $this->page_model->switchOrder($key,$newRank);
            }
        }
    }  

In your model: (In my models/page_model.php)

    public function getOrderList()
    {
        $sql = "SELECT id, page_order FROM bf_page";
        $query = $this->db->query($sql);
            if (!empty($query) && $query->num_rows() > 0)
            {
                $result = $query->result_array();
                $list = array();
                foreach($query->result() as $row)
                {
                    $list[$row->id]= $row->page_order;
                }
                return $list;
            } else 
            {
                    return FALSE;
            }
    }

Any improvement suggestions are welcome!

Ok, now to get it working with the table created by the module builder.

In your module view: (in this case content/index.php) Give the table an id value and supply each generated row with the id value of the current record in the foreach loop, like this:

<h2>Page</h2>
    <table id="sort">
        <thead>
            <tr>
......
.....
</thead>
        <tbody>
        <?php foreach ($records as $record) : ?>
            <tr id="<?php echo $record->id?>">
                <td><?php echo $record->page_title?></td>

Ok, now adjust the js.php content so it can sort table rows: (thanx to google: http://www.foliotek.com/devblog/make-table-rows-sortable-using-jquery-ui-sortable/ )

$(document).ready(function(){   
    // Return a helper with preserved width of cells
    var fixHelper = function(e, ui) {
    ui.children().each(function() {
        $(this).width($(this).width());
    });
    return ui;
    };

    $('#sort tbody').sortable({
        update: function() {
            var stringDiv = "";
            $("#sort tbody").children().each(function(i) {
                var li = $(this);
                stringDiv += " "+li.attr("id") + '=' + i + '&';
            });

            $.ajax({
                type: "POST",
                url: "<?=base_url().'/admin/content/page/updateOrder'?>",
                data: stringDiv
            }); 
        }
    }); 
    $( "#sortable" ).disableSelection();    
});

Of course I added new methods to the module's model, because I wanted a sorted result.

So I added to the model: (In my case model/page_model.php)

    public function findAllSorted()
    {
        $sql = "SELECT * FROM bf_page ORDER BY page_order";
        $query = $this->db->query($sql);
        if (!empty($query) && $query->num_rows() > 0)
        {
            return $query->result();
        } 
    }

Hope someone can use this :D

Hehe lol

At least I learned something :)