JQuery dynamically displays and hides a column in the datagrid

  • 2020-03-30 00:48:58
  • OfStack

 
$(function(){ 
$('#tt').datagrid({ 
title:' Statistics report ', 
width:1020, 
height:400, 
url:'', 
fitColumns:true, 
loadMsg:' Is access to , Please wait ...', 
singleSelect:true, 
nowrap:false, 
columns:[[ 
{field:'REGION_NAME',title:' branch ',width:30,align:'center'}, 
{field:'COUNTY_NAME',title:' county ',width:80,align:'center',editor:'text'}, 
{field:'AREA_NAME',title:' The grid ',width:80,align:'center',editor:'text'}, 
{field:'ORG_NAME',title:' branches ',width:80,align:'center'}, 
{field:'TOTAL_NUM',title:' The total volume ',width:40,align:'center'}, 
{field:'DH_NUM',title:' Single width business volume ',width:40,align:'center'}, 
{field:'RH_NUM',title:' Integrated business volume ',width:40,align:'center'}, 
{field:'YYT_NUM',title:' Business office volume ',width:40,align:'center'}, 
{field:'QT_NUM',title:' Other business volume ',width:40,align:'center'} 
]], 
toolbar:[ 
], 
onDblClickRow: function() { 
//selected = $('#tt').datagrid('getSelected'); 
//var index = $('#tt').datagrid('getRowIndex', selected); 
//$('#tt').datagrid('beginEdit', index); 
//progress(); 
//taskPreempte(selected.taskId); 
} 
}); 

$('#my_toolbar').appendTo('.datagrid-toolbar'); 

var dd = new Date(); 
var d1 = dd.getFullYear()+ "-" + (dd.getMonth()+1) + "-1" ; 
var d2 = dd.getFullYear() + "-" + (dd.getMonth()+1) + "-" + dd.getDate() ; 
$('#qryStartDate').datebox('setValue', d1); // set datebox value 
$('#qryEndDate').datebox('setValue', d2); // set datebox value 
refreshRpt2(); 

}); 

function refreshRpt2(){ 
var strStatCond = "b.region_name"; 
if($('#qryCon').attr("value")!=100){ 
param.sts = $('#qryCon').attr("value"); 
alert(param.sts); 
} 
param.qryBeginTime =$('#qryStartDate').datebox('getValue'); 
//alert(param.qryBeginTime); 
param.qryEndTime = $('#qryEndDate').datebox('getValue'); 
//alert(param.qryEndTime); 

if($('#region')!= null && $('#region').attr("checked") == true){ 

} 
if($('#county')!= null && $('#county').attr("checked") == true){ 
strStatCond += ",c.county_name"; 
$('#tt').datagrid('showColumn', 'COUNTY_NAME'); 

}else{ 
$('#tt').datagrid('hideColumn', 'COUNTY_NAME'); 
} 

if($('#area')!= null && $('#area').attr("checked") == true){ 
strStatCond += ",d.area_name"; 
$('#tt').datagrid('showColumn', 'AREA_NAME'); 
}else{ 
$('#tt').datagrid('hideColumn', 'AREA_NAME'); 
} 
if($('#org')!= null && $('#org').attr("checked") == true){ 
strStatCond += ",e.org_name"; 
$('#tt').datagrid('showColumn', 'ORG_NAME'); 
}else{ 
$('#tt').datagrid('hideColumn', 'ORG_NAME'); 
} 
alert(strStatCond); 
param.statCond = strStatCond; 
param.rptName = "statBusiRpt"; 
JSBaseCall.execute(param,showResult2); 
} 
//Display recordset
function showResult2(data){ 
var strJson=data["defaultJsonString"]; 
var result=eval('(' + strJson + ')'); 
//alert(strJson); 
if (result.KEY_JSCALL_RESULT){ 
if (result.KEY_SERVICE_RES){// successful  
totalRec=result.KEY_TOTAL_REC; 
var d={"total":pageShowRec, 
"rows":result.defaultAList 
}; 
$('#tt').datagrid('loadData',d); 
} 
} 
} 

For example, when there is no data in "qu county", the table will not show the empty column, but directly hide this column

Related articles: