2

我是 JavaScript 和 jQuery 的新手。我正在尝试实现此处链接的小提琴功能，用于通过拖放对表格行进行排序。

我曾经复制 - 粘贴整个代码以使其在 NetBeans 中工作，但它不工作。只显示表格。无法拖放。我需要添加任何 jQuery 文件吗？我正在使用 Yii 项目。我在我的 PHP 文件中复制了 html 和 JavaScript 代码。还有其他要求吗？

        <h1>Sorting A Table With jQuery UI</h1>
    <a href='http://www.foliotek.com/devblog/make-table-rows-sortable-using-jquery-ui-sortable/'>Make table rows sortable with jQuery UI</a>

    <table id="sort" class="grid" title="Kurt Vonnegut novels">
        <thead>
            <tr><th class="index">No.</th><th>Year</th><th>Title</th><th>Grade</th></tr>
        </thead>
        <tbody>
            <tr><td class="index">1</td><td>1969</td><td>Slaughterhouse-Five</td><td>A+</td></tr>
            <tr><td class="index">2</td><td>1952</td><td>Player Piano</td><td>B</td></tr>
            <tr><td class="index">3</td><td>1963</td><td>Cat's Cradle</td><td>A+</td></tr>
            <tr><td class="index">4</td><td>1973</td><td>Breakfast of Champions</td><td>C</td></tr>
            <tr><td class="index">5</td><td>1965</td><td>God Bless You, Mr. Rosewater</td><td>A</td></tr>
        </tbody>
    </table>

<script>

        var fixHelperModified = function(e, tr) {
        var $originals = tr.children();
        var $helper = tr.clone();
        $helper.children().each(function(index) {
            $(this).width($originals.eq(index).width())
        });
        return $helper;
    },
        updateIndex = function(e, ui) {
            $('td.index', ui.item.parent()).each(function (i) {
                $(this).html(i + 1);
            });
        };

    $("#sort tbody").sortable({
        helper: fixHelperModified,
        stop: updateIndex
    }).disableSelection();
</script>
4

1 回答 1

2

您很可能需要在视图中注册 jquery 和 jquery.ui：

<?php 
Yii::app()->clientScript->registerCoreScript('jquery'); 
Yii::app()->clientScript->registerCoreScript('jquery.ui');
?>
于 2013-07-17T18:33:41.197 回答