Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
wiki:predefined_formatter [2010/04/17 01:26] preichow |
wiki:predefined_formatter [2018/02/02 20:52] (current) admin |
||
---|---|---|---|
Line 1: | Line 1: | ||
- | ~~ODT~~ | ||
====== Predefined Formatter ====== | ====== Predefined Formatter ====== | ||
Line 6: | Line 5: | ||
Formatter can be used in either of two ways: Predefined and [[:wiki:custom_formatter | Custom]]. | Formatter can be used in either of two ways: Predefined and [[:wiki:custom_formatter | Custom]]. | ||
- | In this section, we discuss the Predefined Formatter. | + | In this section, we discuss the Predefined Formatter. |
===== jqGrid Module Requirements ===== | ===== jqGrid Module Requirements ===== | ||
In order to use the formatting features, make sure you check the box for the Formatter module when you download jqGrid. | In order to use the formatting features, make sure you check the box for the Formatter module when you download jqGrid. | ||
- | For more information refer to [[:wiki:download | Download jqGrid]] | + | For more information refer to [[:wiki:download | Download jqGrid]]. |
===== Language options ===== | ===== Language options ===== | ||
- | Default formatting functions are defined in the language files e.g., grid.locale-xx (where xx is your language). That mean that these formatter options are loaded when the grid java script files are loaded. | + | Default language formatting options are defined in the language files e.g., grid.locale-xx (where xx is the two character code for your language, en for English). |
- | <note>The default formatter options are different for different language files.</note> | + | |
- | Here is the English variant of the default formatter options. | + | That means that the Formatter options are loaded when the grid javascript files are loaded. |
+ | <note>The default Formatter options are different for each language file.</note> | ||
+ | |||
+ | Here are the default Formatter options for the English file: | ||
<code javascript> | <code javascript> | ||
- | $jgrid = { | + | jQuery.jgrid = { |
... | ... | ||
formatter : { | formatter : { | ||
Line 39: | Line 40: | ||
srcformat: 'Y-m-d', | srcformat: 'Y-m-d', | ||
newformat: 'd/m/Y', | newformat: 'd/m/Y', | ||
+ | parseRe: /[Tt\\\/:_;.,\t\s-]/, | ||
masks : { | masks : { | ||
ISO8601Long:"Y-m-d H:i:s", | ISO8601Long:"Y-m-d H:i:s", | ||
Line 63: | Line 65: | ||
</code> | </code> | ||
- | Here you will find all the settings that you may want to review or change before using the predefined formats. These settings can also be overridden for specific columns using the formatoptions parameter in colModel. | + | Here you will find all the settings that you may want to review or change before using the predefined formats. These settings can also be overridden for specific columns using the formatoptions parameter in the colModel. |
The second step is to set the desired formatting in colModel. This is done using the option //formatter//. For example. | The second step is to set the desired formatting in colModel. This is done using the option //formatter//. For example. | ||
Line 79: | Line 81: | ||
</code> | </code> | ||
- | will format the contents of the 'myname' column according to the rules set for 'number' in the active language file. For example, if the source value is "1234.1", then the value that actually will be put in the grid will be "1 234.10" using the options above. | + | The example above will format the contents of the 'myname' column according to the rules set for 'number' in the active language file. For example, if the source value is "1234.1", then the value that actually will be put in the grid will be "1 234.10" using the options above. |
===== Column Specific Options ===== | ===== Column Specific Options ===== | ||
Line 108: | Line 110: | ||
|integer|thousandsSeparator,\\ defaulValue| thousandsSeparator determines the separator for the thousands, defaultValue set the default value if nothing in the data| | |integer|thousandsSeparator,\\ defaulValue| thousandsSeparator determines the separator for the thousands, defaultValue set the default value if nothing in the data| | ||
|number|decimalSeparator,\\ thousandsSeparator,\\ decimalPlaces,\\ defaulValue|thousandsSeparator determines the separator for the thousands, decimalSeparator determines the separator for the decimals, decimalPlaces determine how many decimal places we should have for the number, defaultValue set the default value if nothing in the data| | |number|decimalSeparator,\\ thousandsSeparator,\\ decimalPlaces,\\ defaulValue|thousandsSeparator determines the separator for the thousands, decimalSeparator determines the separator for the decimals, decimalPlaces determine how many decimal places we should have for the number, defaultValue set the default value if nothing in the data| | ||
- | |currency|decimalSeparator,\\ thousandsSeparator,\\ decimalPlaces,\\ defaulValue,\\ prefix,\\ suffix| The same as number, but we add aditional two options - prefix a text the is puted before the number and suffix the text that is added after the number| | + | |currency|decimalSeparator,\\ thousandsSeparator,\\ decimalPlaces,\\ defaulValue,\\ prefix,\\ suffix| The same as number, but we add aditional two options - prefix: text that is inserted before the number and suffix: text that is added after the number| |
- | |date|srcformat,\\ newformat| srcformat is the source format - i.e. the format of the date that should be converted, newformat is the new output format. The definition of the date format uses the PHP conversions. Also you can use a set of predefined date format - see the mask options in the default date formatting set| | + | |date|srcformat,\\ newformat, \\ parseRe| srcformat is the source format - i.e. the format of the date that should be converted, newformat is the new output format. The definition of the date format uses the PHP conversions. Also you can use a set of predefined date format - see the mask options in the default date formatting set. parseRe is a expression for parsing date strings.| |
|email|none|When a mail type is used we directly add a href with mailto: before the e-mail| | |email|none|When a mail type is used we directly add a href with mailto: before the e-mail| | ||
|link|target|The default value of the target options is null. When this options is set, we construct a link with the target property set and the cell value put in the href tag.| | |link|target|The default value of the target options is null. When this options is set, we construct a link with the target property set and the cell value put in the href tag.| | ||
Line 115: | Line 117: | ||
|checkbox|disabled|The default value for the disabled is true. This option determines if the checkbox can be changed. If set to false, the values in checkbox can be changed| | |checkbox|disabled|The default value for the disabled is true. This option determines if the checkbox can be changed. If set to false, the values in checkbox can be changed| | ||
|select|none|this is not a real select but a special case. See note below| | |select|none|this is not a real select but a special case. See note below| | ||
+ | |actions|{ \\ keys: false,\\ editbutton : true, \\ delbutton : true, \\ editformbutton: false, \\ onEdit : null, \\ onSuccess: null, \\ afterSave:null, \\ onError: null, \\ afterRestore: null, \\ extraparam: {oper:'edit'}, \\ url: null, \\ delOptions: {}, \\ editOptions : {} \\ } \\ |This type of formatter is a easy way to add a buttons at certain column for inline editing. We add a two types of actions edit and delete. When the editformbutton parameter is set to true the form editing dialogue appear instead of in-line edit. The option editOptions will be used only for the form editing.| | ||
==== Formatter type "Select" ==== | ==== Formatter type "Select" ==== | ||
Line 154: | Line 157: | ||
jQuery("#grid_id").jqGrid({ | jQuery("#grid_id").jqGrid({ | ||
... | ... | ||
- | colModel: [ {name:'myname', edittype:'select', formatter:'showlink', formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit'}, ...} | + | colModel: [ {name:'myname', formatter:'showlink', formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit'}, ...} |
... | ... | ||
] | ] | ||
Line 174: | Line 177: | ||
jQuery("#grid_id").jqGrid({ | jQuery("#grid_id").jqGrid({ | ||
... | ... | ||
- | colModel: [ {name:'myname', edittype:'select', formatter:'showlink', formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit', idName:'myid'}, ...} | + | colModel: [ {name:'myname', formatter:'showlink', formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit', idName:'myid'}, ...} |
... | ... | ||
] | ] | ||
Line 188: | Line 191: | ||
</code> | </code> | ||
+ | |||
+ | //But i don't know where from is value'123' ; |