Hi
I have a Angularjs PQ Grid for displaying records. one of column have button control for downloading file from the server on click event.
now i want to show a progressbar image on same column as button control reside and hide button on button's click event. button will be shown again after completing download the file. my initial grid option as follows.. How to do that please help
var obj = {
width: "100%",
// height: 400,
colModel: [
{
title: "Request Date", dataIndx: "reqDate", editable: false,
template: '<span ng-class="ri%2==0?\'bold_cls\':\'\'">{{rd.reqDate}}</span>'
},
{ title: "Request Number", editable: false, dataType: "integer", dataIndx: "reqNo", template: '{{rd.reqNo}}' },
{ title: "Finnancial Year", editable: false, dataType: "string", dataIndx: "finYr", template: '{{rd.finYr}}' },
{ title: "Quarter", editable: false, dataType: "string", dataIndx: "qrtr", template: '{{rd.qrtr}}' },
{ title: "Form Type", editable: false, dataType: "string", dataIndx: "frmType", template: '{{rd.frmType}}' },
{ title: "File Processed", editable: false, dataType: "string", dataIndx: "dntype", template: '{{rd.dntype}}' },
{ title: "Status", editable: false, dataType: "string", dataIndx: "status", template: '{{rd.status}}' },
{ title: "Remarks", editable: false, dataType: "string", dataIndx: "remarks", template: '{{rd.remarks}}' },
{
title: "", align: 'center', editable: false,
render: function (ui) {
var width = ui.column.outerWidth, ci = ui.colIndx
return '<button ng-show="{{rd.status ==\'Available\'}}" type="button" class="btnCss btn btn-warning" ng-click="vm.showMe(rd)">Download</button> ';
}
}
],
resizable: false,
pageModel: { type: "local", rPP: 20 },
collapsible: false,
title: "",
scrollModel: { autoFit: true },
dataModel: { data: 'vm.myData' }
};
