实现jquery-ui.js时,可排序的行无法正常工作

时间:2014-01-07 05:21:42

标签: jqgrid jquery-ui-sortable

我正在尝试在jqgrid中实现可排序的行,我已经搜索了很多但仍然可排序的行不起作用。这是我包含的js文件

 <script src="@Url.Content("~/Scripts/jquery-ui-1.8.6.custom.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jqgrid/js/jquery.layout.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jqgrid/js/i18n/grid.locale-en.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jqgrid/js/jquery.jqGrid.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jqgrid/jquery.jqGrid.src.js")"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

这是我的代码

 function BindGridView(columnNames, colModel) {
        myData = [
                    { ID: "1", Name: "Aswin", Value: "2" },
                    { ID: "3", Name: "bshley", Value: "2" },
                    { ID: "2", Name: "sgnel", Value: "4" },
                    { ID: "4", Name: "dnoop", Value: "6" }
        ];
        var gridimgpath = '/Scripts/jqgrid/themes/redmond/images';

        $("#dataList").jqGrid('GridUnload');
        jQuery("#dataList").jqGrid({
           datatype: "local",
            data: myData,
            loadonce: true,
            colNames: ["ID", "Name", "Value"],
            colModel: [
                    { name: "ID", width: 80 },
                    { name: "Name", width: 90 },
                    { name: "Value", width: 80, align: "right" }
            ],
            autowidth: true,
            width: 'auto',
            height: 'auto',
            rowNum: 10,
            rowList: [10, 20, 30],
            scrolling: true,
            shrinktofit: true,
            pager: '#pager',
            sortable: true,
            sortname: 'Name',
            rownumbers: false,
            rownumWidth: 30,
            viewrecords: true,
            sortorder: "desc",
            multiselect: false,
            imgpath: gridimgpath,

        }).navGrid("#pager",
    { refresh: false, add: false, edit: false, search: false, del: false },
        {}, // settings for edit
        {}, // settings for add
        {}, // settings for delete
        {} // Search options. Some options can be set on column level
 );


    }
    jQuery("#dataList").jqGrid(
'sortableRows',
{
    update: function (e, ui) {
        console.log("sortable");
        alert("item with id=" + ui.item[0].id + " is droped");
    }
});

    jQuery("#dataList").setGridParam({ data: myData }).trigger("reloadGrid");

网格加载了数据,但可排序行的拖放功能无效。

0 个答案:

没有答案