Yii CGridView使用键盘's箭头上下移动选定行


Yii CGridView move selected row using keyboard's arrow up and down

我想知道如何使用箭头按钮上下移动Yii的CGridView中选定的行。我的情况是,我有一个CGridView与pagination = false(没有分页)。我希望在加载页面时自动选择第一行。然后,当用户移动向下箭头时,它将选择第二行。关键是移动选择行而不是上下移动行。

主要思想与Excel类似。它将帮助用户验证行

我发现使用jquery要容易得多,因为yii CGridView javascript getSelection将返回模型的id,而id不在CGridView(表)的任何地方显示。

这是我的解决方案

<script type="text/javascript">
shortcut.add("Down", function() {
    moveDown();
});
shortcut.add("Up", function() {
    moveUp();
});
function moveDown() {
    var rows = $('#form-detail-grid table tr');
    var currentRow = $("tr.selected").get(0);
    if (rows.length > 2) {
        if (currentRow === undefined) {
            rows.eq(1).addClass('selected');
        } else if ($(currentRow).next('tr').get(0) === undefined) {
            //do nothing
        } else {
            $(currentRow).next('tr').addClass('selected');
            $(currentRow).removeClass('selected');
        }
    }
}
function moveUp() {
    var rows = $('#form-detail-grid table tr');
    var currentRow = $("tr.selected").get(0);
    if (rows.length > 2) {
        if (currentRow === undefined) {
            rows.eq(1).addClass('selected');
        } else if ($(currentRow).prev('tr').get(0) === undefined) {
            //do nothing
        } else {
            $(currentRow).prev('tr').addClass('selected');
            $(currentRow).removeClass('selected');
        }
    }
}

我认为你必须为此编写自定义javascript。

我不认为有一个现成的Yii解决方案(也许在一个扩展中,也许)。

Yii 告诉您通过将类"selected"添加到网格中的<tr> s来选择哪一行。

您需要编写一个javascript函数,将类"selected"添加到网格中的下一行(并从前一行中删除它)以获得您想要的,我认为。

也许你可以使用一些Yii的内置jquery函数来操作CGridView。我写过一些关于这个的东西,但这是一个未完成的帖子,抱歉。