jqGrid行删除

时间:2011-03-28 20:42:02

标签: javascript jquery-plugins jqgrid

我有一个按钮用于在选中时删除一行调用内置函数'delRowData'。很简单,直到你想删除一行/多行(如内置变量'selarrrow')。有没有人比我想出的可怕的渣土有更好的答案(例如修改核心jqGrid代码)?

这是我的代码:

        $("#deleteButton").click(function(){ 
            var gr = jQuery("#myGrid").jqGrid('getGridParam','selarrrow'); 
            var su=jQuery("#myGrid").jqGrid('delRowData',gr.toString()); 
            (su) ? '' : alert("Already deleted or not in list"); 
        }); 

现在是在jquery.jqGrid.min.js中修改核心代码的非常讨厌的部分:

delRowData:function(f){
for(var m=0,max=f.length;m<max;m++){
    var j=false,i,c;
    this.each(function(){
        var e=this;
        if(i=e.rows.namedItem(f[m])){
            b(i).remove();
            e.p.records--;
            e.p.reccount--;
            e.updatepager(true,false);
            j=true;
            if(e.p.multiselect){
                c=b.inArray(f[m],e.p.selarrrow);
                c!=-1&&e.p.selarrrow.splice(c,1)
            }
            if(f==e.p.selrow)e.p.selrow=null
        }else return false;
        if(e.p.datatype=="local"){
            var k=e.p._index[f[m]];
            if(typeof k!="undefined"){
                e.p.data.splice(k,1);
                e.refreshIndex()
            }
        }
    });
}
        /*if(e.p.altRows===true&&j){
            var n=e.p.altclass;b(e.rows).each(function(a){
                a%2==1?b(this).addClass(n):b(this).removeClass(n)
            })
        }*/

    return j
}

有更好的方法吗?

/ * 新细节** /
因此,即使我们迭代给定的jqGrid数组'selarrrow'并使用jqGrid的默认'delRowData'函数逐个删除行:

$("#deleteButton").click(function(){ 
    $.each($("#myGrid").jqGrid('getGridParam','selarrrow'), function(index, value) {
        console.log($("#myGrid").jqGrid('getGridParam','selarrrow'));
        if ($("#myGrid").jqGrid('delRowData', value)) {
            console.log($("#myGrid").jqGrid('getGridParam','selarrrow'));
            console.log(value);
        } 
        else{
            console.log($("#myGrid").jqGrid('getGridParam','selarrrow'));
            console.log(value);
        }
    });
}); 

你会看到代码没有正确执行,我们必须回过头来看看'delRowData'的jqGrid核心代码函数。现在的问题在于它如何处理阵列。这是未缩小的功能:

delRowData:function(f){
    var j=false,i,c;
    this.each(function(){
        var e=this;
        if(i=e.rows.namedItem(f)){
            b(i).remove();
            e.p.records--;
            e.p.reccount--;
            e.updatepager(true,false);
            j=true;
            if(e.p.multiselect){
                c=b.inArray(f,e.p.selarrrow);
                //c!=-1&&e.p.selarrrow.splice(c,1)
            }
            if(f==e.p.selrow)
                e.p.selrow=null
            }else 
                return false;
            if(e.p.datatype=="local"){
                var k=e.p._index[f];
                if(typeof k!="undefined"){
                    e.p.data.splice(k,1);
                    e.refreshIndex()
            }
        }
        if(e.p.altRows===true&&j){
            var n=e.p.altclass;
            b(e.rows).each(function(a){
                a%2==1?b(this).addClass(n):b(this).removeClass(n)
            })
        }
    });
    return j
}

问题是函数中间的注释掉的行。我真的想避免破解核心代码,但似乎你必须这样做,除非你有更好的想法。

3 个答案:

答案 0 :(得分:5)

问题是getGridParam返回对所选行(selarrrow)的引用。然后,您可以使用它来迭代网格中的删除行,这会在您标识的行上修改selarrow。这会改变您正在迭代的集合,以便后续迭代不再指向正确的值。

您可以使用$ .MakeArray迭代所选数组的副本,也可以从数组尾部迭代,例如:

var ids = $('#grid').getGridParam('selarrrow');
for (  var i = ids.length-1; i>=0; i--) {
  $('#grid').delRowData(ids[i]);
}

http://www.trirand.com/blog/?page_id=393/bugs/delrowdata-bug-on-grid-with-multiselect/

进行了讨论

答案 1 :(得分:2)

jqGrid也会从selarrrow中删除已删除的行 - 箭头也是如此。 执行多行删除的方法之一是使用

var selrows = $('#grid').jqGrid('getGridParam', 'selarrrow');

while (selrows.length > 0)
{
  $('#grid').delRowData(selrows[0]);
}

答案 2 :(得分:0)

为什么不使用每个外部而不是黑客攻击核心?

$("#deleteButton").click(function(){
  var errors = [];
  jQuery("#myGrid").jqGrid('getGridParam','selarrrow').each(function(index, value) {
    if (!jQuery("#myGrid").jqGrid('delRowData', value)) errors.push(value);
  });
  if (errors.length)
  {
    alert('Already deleted or not in list on row(s): ' + errors.join(', ')); 
  }
});