field().show()
Show a field in the display that was previously hidden.
Please note - this property requires the Editor extension for DataTables.
Description
This method provides the ability to show a field in the editing form at any time. This can be useful for cases when you want to have extra form fields available, but only show them under certain conditions (for example when a particular value is selected, you might provide further options based on that value). Fields which will never be visible to the end user can use the hidden field type.
When a field is hidden, it is still part of the form and will be submitted with the other fields to the server, when the form is submitted, but it simply won't be visible to the user. The clear() method is used to completely remove fields if required.
This is the inverse of the field().hide() method.
Note that the show() method also provides the ability to show a specific field in the form display, and also extends that ability to being able to operate on multiple fields with a single call. For single fields, these two methods can often be used interchangeably. The key difference is in the return value - this method will return a DataTable.Editor.Field instance, while the show() method returns a DataTable.Editor instance. This can effect how you chain methods if you are using the returned value for chaining.
Type
field(…).show( [ animate, [ toggle ] ] )
Show the fields in the form display.
Parameters:
| Name | Type | Optional | |
|---|---|---|---|
| 1 | animate | Yes - default:true | |
If the field is visible on screen (i.e. the form is shown), by default Editor will attempt to animate the field show by animating the height. This option can be used to override the animation and show the field immediately. If the field is not visible on the page, its display property is set to show immediately. | |||
| 2 | toggle | Yes - default:true | |
Since 2.0: An optional toggle parameter which can be used to hide the field if | |||
Returns:
DataTable.Editor.Field: Field instance
Examples
Use hide() to hide all fields and then display just two fields in the form:
editor.hide();
editor.field('access_type').show();
editor.field('access_priority').show();Show and hide a field, based on user input:
editor
.field('dept')
.input()
.on('change', function () {
if (editor.field('dept').val() === 'Marketing') {
editor.field('marketing-section').show();
}
else {
editor.field('marketing-section').hide();
}
});