issue in reordering rows in datatable

GoogleCodeExporter commented 9 years ago

What steps will reproduce the problem?
1. create one simple html table and apply reordering on it using  reordering 
function

should not give $("tbody", oTable).sortable is not a function code error

following is the code.

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ page import="com.bnpparibas.raid.common.util.ICommonConstants"%>

<script src="content/scripts/itfeatures/code/code.js" 
type="text/javascript"></script>
<script type="text/javascript" 
src="content/scripts/common/html.encoder.js"></script>
<script type="text/javascript" language="javascript" src="<s:url 
value="/content/jquery/core/jquery-ui-1.8.13.custom.min.js"/>"></script>
<script type="text/javascript" language="javascript" src="<s:url 
value="/content/jquery/core/jquery.dataTables.rowReordering.js"/>"></script>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/cupertino/jquery-ui-1.8.13.custom.css" rel="stylesheet" 
type="text/css" />

<script type="text/javascript">
$(document).ready(function() {

    $(document).ready(function () {
        $('#example').dataTable({
                                    bJQueryUI: true,
                                    "sPaginationType": "full_numbers"
                                })
                     .rowReordering();
    }); 

});
</script>

<html>
<body>

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
    <thead>
        <tr>
        <th></th>
            <th>Rendering engine</th>
            <th>Browser</th>
            <th>Platform(s)</th>

            <th>Engine version</th>
            <th>CSS grade</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
        <th></th>
            <th>Rendering engine</th>

            <th>Browser</th>
            <th>Platform(s)</th>
            <th>Engine version</th>
            <th>CSS grade</th>
        </tr>

    </tfoot>

    <tbody>

        <tr data-position="1" class="odd_gradeX" id="100"><td>1</td>
            <td class="read_only"> A Trident(read only cell)</td>
            <td>Internet Explorer 4.0</td>
            <td>Win 95+</td>
            <td class="center">4</td>

            <td class="center">X</td>
        </tr>
        <tr data-position="2" class="even_gradeC" id="101"><td>2</td>
            <td>Trident</td>
            <td>Internet Explorer 5.0</td>
            <td>Win 95+</td>

            <td class="center">5</td>

            <td class="center">C</td>
        </tr>
        <tr data-position="3" class="odd_gradeA" id="102"><td>3</td>
            <td>Trident</td>
            <td>Internet Explorer 5.5</td>

            <td>Win 95+</td>
            <td class="center">5.5</td>

            <td class="center">A</td>
        </tr>   

        </tbody>
    </table>

</body>

</html>

Original issue reported on code.google.com by ashoka.b...@gmail.com on 28 May 2012 at 1:41

GoogleCodeExporter commented 9 years ago

Hi,

It seems to me that sortable is not included in your jquery ui custom js or 
something is not loaded. You need to provide sortable to plugin otherwise drag 
and drop will not work.

Regards,
Jovan

Original comment by joc...@gmail.com on 15 Jul 2012 at 11:50

Added labels: Priority-Low
Removed labels: Priority-Medium

GoogleCodeExporter commented 9 years ago

Original comment by joc...@gmail.com on 27 May 2013 at 9:01

Changed state: Done

mpryvkin / jquery-datatables-row-reordering

issue in reordering rows in datatable #3