データ型の設定

Wijgrid では、dataType オプションを使用することで、個々の列のデータ型を設定できます。wijgrid ウィジェットは、文字列型、数値型、通貨型、日付時刻型、ブール型など、さまざまなデータ型をサポートします。

ライブウィジェット
スクリプト

スクリプト	コードのコピー
<script id="scriptInit" type="text/javascript"> require(["wijmo.wijgrid"], function () { $(document).ready(function () { $("#wijgrid").wijgrid({ cellClicked: function (e, args) { alert(args.cell.value()); }, allowSorting: true, data: [ ['Ipsum LLC', 63.57, 209, .11, '02-01-2014', 'True'], ['Lorem Inc', 74.85, 73, .19, '02-01-2014', 'False'], ['Dolor International', 29.86, 45, .20, '02-01-2014', 'False'], ['Blandit Enterprises', 81.68, 28, .25, '02-01-2014', 'True'], ['Vivamus Services', 76.30, 67, .12, '02-01-2014', 'True'], ], columns: [ { headerText: "Product Name", dataType: 'string' }, //sets data type value to string. { headerText: "Unit Price", dataType: 'currency' }, //sets data type value to currency. { headerText: "Quantity", dataType: 'number', dataFormatString: 'n0' }, //sets data type value to number. //sets format of data as n0. { headerText: "Discount", dataType: 'number', dataFormatString: 'p0' }, { headerText: "Order Date", dataType: 'datetime', dataFormatString: 'MMM-dd-yyyy' }, //sets data type value to datetime. { headerText: "Overseas", dataType: 'boolean' }, //sets data type value to boolean. ] }); }); }); </script>

スクリプト

コードのコピー

<script id="scriptInit" type="text/javascript">
    require(["wijmo.wijgrid"], function () {
        $(document).ready(function () {
            $("#wijgrid").wijgrid({

                cellClicked: function (e, args) {
                    alert(args.cell.value());
                },
                allowSorting: true,
                data: [
                    ['Ipsum LLC', 63.57, 209, .11, '02-01-2014', 'True'],
                    ['Lorem Inc', 74.85, 73, .19, '02-01-2014', 'False'],
                    ['Dolor International', 29.86, 45, .20, '02-01-2014', 'False'],
                    ['Blandit Enterprises', 81.68, 28, .25, '02-01-2014', 'True'],
                    ['Vivamus Services', 76.30, 67, .12, '02-01-2014', 'True'],
                ],
                columns: [
                    { headerText: "Product Name", dataType: 'string' }, //sets data type value to string.
                    { headerText: "Unit Price", dataType: 'currency' }, //sets data type value to currency.
                    { headerText: "Quantity", dataType: 'number', dataFormatString: 'n0' }, //sets data type value to number.
                          //sets format of data as n0.
                    { headerText: "Discount", dataType: 'number', dataFormatString: 'p0' },
                    { headerText: "Order Date", dataType: 'datetime', dataFormatString: 'MMM-dd-yyyy' }, //sets data type value to datetime.
                    { headerText: "Overseas", dataType: 'boolean' }, //sets data type value to boolean.
         
                ]
            });
        });
    });

</script>