search

infinacykhalid / jquery-datatables-row-reordering

Automatically exported from code.google.com/p/jquery-datatables-row-reordering
0 stars 0 forks source link

issue in reordering rows in datatable #3

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 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 8 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

GoogleCodeExporter commented 8 years ago

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