1

我目前正在尝试在 Yii cGridview 中实现自动过滤，默认情况下它会过滤“onclick”或“enter”按键，但我需要将该事件更改为“onkeyup”|

我的代码是这样的 

Yii::app()->clientScript->registerScript('search',"   
    $('.filters > td >input').keyup(function(){    
        $('#grid-id').yiiGridView('update', {
            data: $(this).serialize()  
        });
        return false; 
    });
"); 
?>

当我输入第一个字母时发生过滤，但过滤和渲染代码失败后..请给我一个解决方案..有没有过滤onkeyup的php yii gridview扩展

4

2 回答 2

5

您需要更改附加keyup侦听器的方式。通过 AJAX 刷新 gridview 后，grid 内的所有元素都会被替换。所以就没有keyup附件了。您可以尝试以下方法：

$('body').on('keyup','.filters > td > input', function() {
    $('#grid-id').yiiGridView('update', {
        data: $(this).serialize()  
    });
    return false; 
});
于 2013-09-17T08:15:41.837 回答
1

@Michael Härtl 的回答是正确的。但是当您使用此代码时会出现 2 问题。

1）当时在过滤器中进行用户搜索时，每次都会刷新网格，因此输入框的焦点会丢失。

2）当您在一个过滤器输入中搜索时，如果您当时转到第二个输入字段字段，第一个输入框将丢失。

所以现在我已经找到了解决方案。

在您的网格视图上设置此 java 脚本代码。

Yii::app()->clientScript->registerScript('search', "
$('body').on('keyup','.filters > td > input', function() {
    $(document).data('GridId-lastFocused',this.name);
    data = $('#GridId input').serialize();
    $('#GridId').yiiGridView('update', {
        data: data 
    });
    return false; 
});

// Configure all GridViews in the page
$(function(){
    setupGridView();
});

// Setup the filter(s) controls
function setupGridView(grid)
{
    if(grid==null)
        grid = '.grid-view tr.filters';
    // Default handler for filter change event
    $('input,select', grid).change(function() {
        var grid = $(this).closest('.grid-view');
        $(document).data(grid.attr('id')+'-lastFocused', this.name);
    });
}

// Default handler for beforeAjaxUpdate event
function afterAjaxUpdate(id, options)
{
    var grid = $('#'+id);
    var lf = $(document).data(grid.attr('id')+'-lastFocused');
    // If the function was not activated
    if(lf == null) return;
    // Get the control
    fe = $('[name=\"'+lf+'\"]', grid);
    // If the control exists..
    if(fe!=null)
    {
        if(fe.get(0).tagName == 'INPUT' && fe.attr('type') == 'text')
            // Focus and place the cursor at the end
            fe.cursorEnd();
        else
            // Just focus
            fe.focus();
    }
    // Setup the new filter controls
    setupGridView(grid);
}

// Place the cursor at the end of the text field
jQuery.fn.cursorEnd = function()
{
    return this.each(function(){
        if(this.setSelectionRange)
        {
            this.focus();
            this.setSelectionRange(this.value.length,this.value.length);
        }
        else if (this.createTextRange) {
            var range = this.createTextRange();
            range.collapse(true);
            range.moveEnd('character', this.value.length);
            range.moveStart('character', this.value.length);
            range.select();
        }
        return false;
    });
}");

将此行添加到您的 gridview 小部件代码中。

'afterAjaxUpdate'=>'afterAjaxUpdate',

例如：

$this->widget('zii.widgets.grid.CGridView', array(
                'id' => 'GridId',
                'afterAjaxUpdate'=>'afterAjaxUpdate',
));
于 2015-10-15T12:20:24.210 回答