jQWidgets Forums

Tagged: datagrid cells formatting, gridview localization, jqxgrid

This topic contains 4 replies, has 2 voices, and was last updated by sved 12 years, 5 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)

Author

CellsFormat is not working Posts

November 19, 2012 at 10:21 am CellsFormat is not working #11177

sved

Participant

Hello, I’m trying to format following json string in grid

“id”:”1″,”period_end”:”2012-10-07 00:00:00″,,”email_address”:”test@test.com”,”days”:”32″,”last_order”:”2012-09-05 00:00:00″,”lifetime”:”4″,”sales”:”51198.00″,”_profit”:”51198.00″,”value”:”12119.50″

with cellsformat, but with no success.
I’m using following code for formatting of last_order field:
{ text=”Last Order”, cellsformat=”d”, datafield=”last_order”, …}

I’m trying to format the sales field too with format c2, but it didn’t format it as percent.
I’m applying following localization, but it didn’t work:

var localizationobj = {};
localizationobj.firstDay =’1′;
localizationobj.percentsymbol = “%”;
localizationobj.currencysymbol = “$”;
localizationobj.currencysymbolposition = “before”;
localizationobj.decimalseparator = “,”;
localizationobj.thousandsseparator = ” “;

November 19, 2012 at 10:22 am CellsFormat is not working #11180

Peter Stoev

Keymaster

Hi sved,

c2 is format for currency, not for percent. p2 is for percent.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

November 19, 2012 at 10:28 am CellsFormat is not working #11181

sved

Participant

My bad, I try it as p2, but still doesn’t work. date format is not working as well

November 19, 2012 at 10:37 am CellsFormat is not working #11184

Peter Stoev

Keymaster

Hi sved,

You have syntax issue in the posted data, there’s double “,,” after ”2012-10-07 00:00:00″

Here’s a working sample based on your code and implemented with jQWidgets 2.5.

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.filter.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.edit.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.sort.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/globalization/jquery.global.js"></script>
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript" src="generatedata.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var theme = getTheme();
            var data = '[{"id":"1","period_end":"2012-10-07 00:00:00","email_address":"test@test.com","days":"32","last_order":"2012-09-05 00:00:00","lifetime":"4","sales":"51198.00","_profit":"51198.00","value":"12119.50"}]';
            var source =
            {
                datatype: 'json',
                localdata: data,
                datafields: [
                    { name: 'period_end', type: 'date' },
                    { name: 'days' },
                    { name: 'last_order', type: 'date' },
                    { name: 'sales', type: 'number' }
                ]
            };
            var dataAdapter = new $.jqx.dataAdapter(source);
            $('#jqxgrid').jqxGrid(
            {
                source: dataAdapter,
                theme: 'classic',
                columns: [
                    { text: 'period_end', datafield: 'period_end', cellsformat: 'd', width: 90 },
                    { text: 'days', datafield: 'days', width: 90 },
                    { text: 'last_order', datafield: 'last_order', cellsformat: 'd', width: 90 },
                    { text: 'sales', datafield: 'sales', cellsformat: 'p2', width: 90 }
                ]
           });
        });
    </script>
</head>
<body class='default'>
    <div id="jqxgrid">
    </div>
</body>
</html>

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

November 19, 2012 at 11:00 am CellsFormat is not working #11187

sved

Participant

Thanks, I saw my errors, there was no type in datafields array.

Author

Posts

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.