jQuery UI Widgets › Forums › Grid › Keep decimal places when exporting GridView to Excel
Tagged: Cell, cellsformat, decimal, excel, export, export to excel, Exportdata, format, formatting, grid, jqxgrid, number
This topic contains 1 reply, has 2 voices, and was last updated by Dimitar 10 years, 1 month ago.
-
Author
-
Hi,
I need to deploy export to excel functionality in JQXgrid.
But some of the columns have decimal values.
I try to format those columns to 2 decimal values,during export to excel.
Result is getting those columns without formatting.(such as 24234.0608745 instead of 24234.06)
In my project,all of the values are retrieved dynamically from database.
Below is my code.Please help me.
Thanks in advance.function JqxGridCreate(jqxDiv, ajaxURL, hiddenJQX) {
// $(document).ready(function () {try {
// debugger;
$.ajax({
type: “POST”,
url: ajaxURL,
data: “{}”,
contentType: “application/json; charset=utf-8”,
success: SuccessTestService,
dataType: “json”,
failure: ajaxCallFailed
});
}
catch (e) {
alert(‘failed to call web service. Error: ‘ + e);
}var pagerrenderer = function () {
var element = $(“<div style=’margin-top: 5px; width: 100%; height: 100%;’></div>”);
var paginginfo = $(jqxDiv).jqxGrid(‘getpaginginformation’);
for (i = 0; i < paginginfo.pagescount; i++) {
// add anchor tag with the page number for each page.
var anchor = $(“” + i + ““);
anchor.appendTo(element);
anchor.click(function (event) {
// go to a page.
var pagenum = parseInt($(event.target).text());
$(jqxDiv).jqxGrid(‘gotopage’, pagenum);
});
}
return element;
}function SuccessTestService(response) {
debugger;
var jsdata = JSON.parse(response.d);
var columns = jsdata[0].columns;
var rows = jsdata[1].rows;
var listsourcedata = jsdata[2].listsource;
var datafield = jsdata[3].Table3;var source =
{
datatype: “json”,
datafields: datafield,
localdata: rows
};var cellsrenderer = function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
if (value < 20) {
return ‘<span style=”margin: 4px; float: ‘ + columnproperties.cellsalign + ‘; color: #ff0000;”>’ + value + ‘</span>’;
}
else {
return ‘<span style=”margin: 4px; float: ‘ + columnproperties.cellsalign + ‘; color: #008000;”>’ + value + ‘</span>’;
}
}var dataAdapter = new $.jqx.dataAdapter(source, {
downloadComplete: function (data, status, xhr) { },
loadComplete: function (data) { },
loadError: function (xhr, status, error) { }
});$(jqxDiv).jqxGrid(
{
source: dataAdapter,
ready: function () {
// callback function which is called by jqxGrid when the widget is initialized and the binding is completed.
},
columnsresize: true,
sortable: true,
pageable: true,
autoheight: true,
// pagerrenderer: pagerrenderer,
width: ‘100%’,
filterable: true,
columnsheight: 75,
pagesizeoptions: [‘5′, ’10’, ’20’, ’30’, ’50’],
theme: ‘arctic’,
columns: columns
});FillDropDownList(listsourcedata);
$(“#excelExport”).jqxButton({ theme: ‘arctic’ });
$(“#csvExport”).jqxButton({ theme: ‘arctic’ });
}
function FillDropDownList(listsourcedata) {
//debugger;
$(“#jqxdropdownlist”).jqxDropDownList({ source: listsourcedata, filterable: true, checkboxes: true, displayMember: “label”, valueMember: “value”, width: 200, height: 25 });$(“#jqxdropdownlist”).on(‘checkChange’, function (event) {
$(jqxDiv).jqxGrid(‘beginupdate’);
if (event.args.checked) {
$(jqxDiv).jqxGrid(‘showcolumn’, event.args.value);
}
else {
$(jqxDiv).jqxGrid(‘hidecolumn’, event.args.value);
}
$(jqxDiv).jqxGrid(‘endupdate’);
});
}function ajaxCallFailed(error) {
alert(‘error: ‘ + error);
}
//});
}
function ExportTO() {
var exportInfo;
exportInfo = $(jqxDiv).jqxGrid(‘exportdata’, ‘xls’);
$(hiddenJQX).val(“”);
$(hiddenJQX).val(exportInfo);
}function ExportTOCSV() {
var exportInfo;
exportInfo = $(jqxDiv).jqxGrid(‘exportdata’, ‘csv’);
$(hiddenJQX).val(“”);
$(hiddenJQX).val(exportInfo);
}Regards,
Karthic SrinivasanHello Karthic Srinivasan,
In the provided sample there is no code which changes the numbers formatting to two decimal values. Our suggestion is to apply the property cellsformat with a value of “f2” (for floating point numbers with two decimal values) to your number column. Since your columns object is automatically generated, you would have to set the cellsformat column field before you initialize the grid. E.g., if the numbers column is the first one, add the following line before the grid initialization code:
columns[0].cellsformat = 'f2'; $(jqxDiv).jqxGrid({ source: dataAdapter, ready: function () { // callback function which is called by jqxGrid when the widget is initialized and the binding is completed. }, columnsresize: true, sortable: true, pageable: true, autoheight: true, // pagerrenderer: pagerrenderer, width: '100%', filterable: true, columnsheight: 75, pagesizeoptions: ['5', '10', '20', '30', '50'], theme: 'arctic', columns: columns });
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/ -
AuthorPosts
You must be logged in to reply to this topic.