jqwidgets: Grid Cells Formatting
4454 단어 format
jqxGrid
The cellsformat property can be used for applying a formatting to the cell values. In the code example below is illustrated how to apply a custom formatting to a column with Date values and to a column with Numeric values.
$("#jqxgrid").jqxGrid(
{
width: 670,
height: 450,
source: source,
theme: theme,
sortable: true,
columns: [
{ text: 'Ship Name', datafield: 'ShipName', width: 250 },
{ text: 'Shipped Date', datafield: 'ShippedDate', width: 230, cellsformat: 'D' },
{ text: 'Freight', datafield: 'Freight', width: 130, cellsformat: 'F2', cellsalign: 'right' },
{ text: 'Ship Address', datafield: 'ShipAddress', width: 350 },
{ text: 'Ship City', datafield: 'ShipCity', width: 100 },
{ text: 'Ship Country', datafield: 'ShipCountry', width: 100 }
]
});
Number format strings:
"d" - decimal numbers. "f" - floating-point numbers. "n" - integer numbers. "c" - currency numbers. "p" - percentage numbers.
For adding decimal places to the numbers, add a number after the formatting string.
For example: "c3" displays a number in this format $25.256
Built-in Date formats:
// short date pattern "d" - "M/d/yyyy", // long date pattern "D" - "dddd, MMMM dd, yyyy", // short time pattern "t" - "h:mm tt", // long time pattern "T" - "h:mm:ss tt", // long date, short time pattern "f" - "dddd, MMMM dd, yyyy h:mm tt", // long date, long time pattern "F" - "dddd, MMMM dd, yyyy h:mm:ss tt", // month/day pattern "M" - "MMMM dd", // month/year pattern "Y" - "yyyy MMMM", // S is a sortable format that does not vary by culture "S" - "yyyy\u0027-\u0027MM\u0027-\u0027dd\u0027T\u0027HH\u0027:\u0027mm\u0027:\u0027ss"
Date format strings:
"d"-the day of the month; "dd"-the day of the month; "ddd"-the abbreviated name of the day of the week; "dddd"- the full name of the day of the week; "h"-the hour, using a 12-hour clock from 1 to 12; "hh"-the hour, using a 12-hour clock from 01 to 12; "H"-the hour, using a 24-hour clock from 0 to 23; "HH"- the hour, using a 24-hour clock from 00 to 23; "m"-the minute, from 0 through 59; "mm"-the minutes,from 00 though59; "M"- the month, from 1 through 12; "MM"- the month, from 01 through 12; "MMM"-the abbreviated name of the month; "MMMM"-the full name of the month; "s"-the second, from 0 through 59; "ss"-the second, from 00 through 59; "t"- the first character of the AM/PM designator; "tt"-the AM/PM designator; "y"- the year, from 0 to 99; "yy"- the year, from 00 to 99; "yyy"-the year, with a minimum of three digits; "yyyy"-the year as a four-digit number; "yyyyy"-the year as a four-digit number.
Grid Cells Formatting Sample
$("#jqxgrid").jqxGrid(
{
width: 670,
height: 450,
source: source,
theme: theme,
sortable: true,
columns: [
{ text: 'Ship Name', datafield: 'ShipName', width: 250, sortable: false },
{ text: 'Shipped Date', datafield: 'ShippedDate', width: 230, cellsformat: 'D' },
{ text: 'Freight', datafield: 'Freight', width: 130, cellsformat: 'F2', cellsalign: 'right' },
{ text: 'Ship Address', datafield: 'ShipAddress', width: 350 },
{ text: 'Ship City', datafield: 'ShipCity', width: 100 },
{ text: 'Ship Country', datafield: 'ShipCountry', width: 100 }
]
});
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
The format-detection attribute and meaning in the Meta tagThe translation of format-detection into Chinese means "format detection". As the name suggests, it is used to detect so...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.