Print Page - colmodel render (export excel)

Hello,

I am painting the cell according to the value from the database.

In this, I use cls in render in colmodel as follows.

There is no problem in painting, but the colors I put in excel are not coming.

reqDateClass returns class like red. I have a css like .red {background-color:red;} in the page. I can return data in a different way.

What kind of coding should I do in colmodel and data to export to Excel?

Code: [Select]

,{title:'Reg.Date',dataIndx:'reqDate',dataType:'date',minWidth:24,width:85,cls:'',clsHead:'',align:'',halign:'center',hidden:false,editable:false
	,editor:{attr:'type="date" autofocus'},format:'dd/mm/yy',formatRaw:'yy-mm-dd',formatSel:'yy-mm-dd'
	,filter:{crules: [{ condition:'between'}],menuIcon:false}
	,render:function (ui) {return {attr:'title="'+ui.cellData+'"',cls:ui.rowData['reqDateClass']} }
}

Thanks.

1) Please return color in hexadecimal format "#ff0000" from the database.

2) Then you can use it in render callback.

Code: [Select]

render:function (ui) {
  return { 
    style : "background-color:" + ui.rowData[ 'field_name' ] +";"
  }
}

I updated it this way, but the background color does not appear in excel.

It appears on the screen as a style.
Do I need to update the export method?

I'm using version 6, do I need to update to version 9?

Code: [Select]

,{title:'Tarih',dataIndx:'Tarih',dataType:'date',minWidth:24,width:85,cls:'',clsHead:'',align:'',halign:'center',hidden:false,editable:false
	,editor:{attr:'type="date" autofocus'},format:'dd/mm/yy',formatRaw:'yy-mm-dd',formatSel:'yy-mm-dd'
	,filter:{crules: [{ condition:'between'}],menuIcon:false}
	,render:function (ui) {return {attr:'title="'+ui.cellData+'"', style :"background-color:"+ui.rowData['ColorCode']+";" } }
}

headItems function:

Code: [Select]

                {
                    name: 'Save AS',
                    icon: 'ui-icon ui-icon-extlink',
                    subItems: [{
                            name: 'Print',
							action: function () {
							console.log(this);
								var exportHtml = this.exportData({ title: 'Print', format: 'htm', render: true }),
								newWin = window.open('', '', 'width=1200, height=700'),
								doc = newWin.document.open();
								doc.write(exportHtml);
								doc.close();
								newWin.print();
							}
						},
                        {
                            name: 'Excel',
                            action: function(){
                                exportData.call(this, 'xlsx');                                    
                            }
                        },
                        {
                            name: 'Csv',
                            action: function(){
                                exportData.call(this, 'csv');                                   
                            }
                        },
                        {
                            name: 'Html',
                            action: function(){
                                exportData.call(this, 'html');
                            }
                        },
                        {
                            name: 'Json',
                            action: function(){
                                exportData.call(this, 'json');
                            }
                        }
                    ]                        
                },

exportData function:

Code: [Select]

        function exportData(format){
            var blob = this.exportData({
                format: format
            }) 
            if(typeof blob === "string"){                            
                blob = new Blob([blob]);
            }
            saveAs(blob, "Portal."+ format );
        }

https://stackblitz.com/edit/paramquery-demo-fcync6?file=index.js

Solved:

Added "render: true" to exportData .

Added if to fix "Uncaught invalid color: undefined" error.

Code: [Select]

         render: function (ui) {
           if (ui.rowData['bc']) {
             return { style: 'background-color:' + ui.rowData['bc'] + ';' };
           }
         },

Color codes were in capital letters: like #FF00FF. lowercase letters. Fixed as #ff00ff now excel background colors are showing.

ParamQuery grid support forum

General Category => Help for ParamQuery Pro => Topic started by: omerix on July 21, 2023, 03:23:27 pm