How to hide row in jqgrid?

Question

I have a grid like this:

//Barang
//label_name
var label_name = ["No", "Part Number", "Part Name", "Price", "Pallete", "UOM", "QTY", "Total", "Action"];


var getLabel = $("#label_name").val();
var arr_label = getLabel.split(',');
var n = arr_label;
for(i=0;i<n.length;i++){
    //label_name.push(n[i]);
}
//label_name.push("Total Demand", "Avarage Demand", "Nilai Total Pengguna Uang", "HIT", "Nilai Persediaan(Value*HIT)");


//content_name
var content_name = [
    {name:'no', index:'no', width:50, align:"right", editable:false, editoptions:{readonly:true}, sorttype:'int', searchoptions:{sopt:['eq']}, search:false},
    {name:'part_number', index:'part_number', width:200, sortable:false, editable:true, searchoptions:{sopt:['eq']}},
    {name:'part_name', index:'part_name', width:200, editable:true, searchoptions:{sopt:['eq']}},
    {name:'price', index:'price', width:150, align:"right", editable:true, editrules:{number:true}, sorttype:'number', formatter:'number', searchoptions:{sopt:['eq']}},
    {name:'pallete', index:'pallete', width:100, sortable:false, editable:true, searchoptions:{sopt:['eq']}, search:false},
    {name:'uom', index:'uom', width:100, editable:true, searchoptions:{sopt:['eq']}, search:false},
    {name:'qty', index:'qty', width:100, editable:true, searchoptions:{sopt:['eq']}, search:false},
    {name:'total', index:'total', width:100, editable:true, searchoptions:{sopt:['eq']}, search:false},
    {name:'action', index:'action', width:100, editable:true, searchoptions:{sopt:['eq']}, search:false}
];


var getLabel = $("#label_name").val();
var arr_label = getLabel.split(',');
var n = arr_label;
for(i=0;i<n.length;i++){
    //content_name.push({name:n[i], index:n[i], width:45, align:"right", sortable:false, editable:false});
}
/*
content_name.push(
    {name:'total_demand', index:'total_demand', width:50, align:"right", sortable:false, editable:false},
    {name:'average_demand', index:'average_demand', width:50, align:"right", sortable:false, editable:false},
    {name:'ntpu', index:'ntpu', width:80, align:"right", sortable:false, editable:false, formatter:'number'},
    {name:'hit', index:'hit', width:30, align:"right", sortable:false, editable:false},
    {name:'nilai_persediaan', index:'nilai_persediaan', width:80, align:"right", sortable:false, editable:false, formatter:'number'}
);
*/

jQuery("#barang").jqGrid({
    url:'load_barang.php',
    datatype: "json",
    colNames:label_name,
    colModel:content_name,
    rowNum:10,
    rowTotal: 50,
    rowList:[10,20,30],
    pager: '#pbarang',
    sortname: 'id',
    loadonce: true,
    viewrecords: true,
    sortorder: "desc",
    editurl: 'server.php', // this is dummy existing url
    caption:"Modul Barang",
    shrinkToFit: false,
    height: 'auto'
});
//jQuery("#barang").jqGrid('navGrid','#pbarang',{});
jQuery("#barang").jqGrid('navGrid','#pbarang',{edit:false,add:false,del:false});
jQuery("#barang").jqGrid('gridResize',{minWidth:350,maxWidth:true,minHeight:80, maxHeight:true});
jQuery("#barang").jqGrid('hideCol',["total"]);

//Resizable Grid
$( "#barang" ).resizable({
    grid: 50
});

//Merge
jQuery("#barang").jqGrid('setGroupHeaders', {
  useColSpanStyle: true, 
  groupHeaders:[
    {startColumnName: n[0], numberOfColumns: n.length, titleText: '<center>Demand</center>'}
    //{startColumnName: 'closed', numberOfColumns: 2, titleText: 'Shiping'}
  ] 
});

//Hide and Show
jQuery("#hcg").click( function() {
    jQuery("#barang").jqGrid('hideCol',["total"]);
});
jQuery("#scg").click( function() {
    jQuery("#barang").jqGrid('showCol',["total"]);
});

I already tried this code $("#"+rowid).hide() according to this answer -> jqgrid hide row inside grid

but it doesn't work in my grid

please help me. Thanks.

The linked answer seems like it should work - what happens when you try it on your grid? Also, are you sure you really want to hide rows? There may be other, more straightforward solutions such as retrieving the data as-needed, applying a filter somehow, deleting the row (but saving the data to a JavaScript object), etc... — Justin Ethier, Jul 16 '13 at 17:44
the row isn't hidden, that's what happened. Please help. by the way if I use '$("#"+rowid).hide()' it should be $("#barang"4).hide(); -> according to my grid, right? — Rio Eduardo, Jul 17 '13 at 03:16

score 0 · Answer 1 · answered Jul 17 '13 at 06:50

0

Try this:

$("#row_id","#barang").css({display:"none"})

answered Jul 17 '13 at 06:50

Pranav Kale

629
1
5
13

How to hide row in jqgrid?

1 Answers1