Search
9302 results 61-70
Reference
searchPanes.panes.options.value› Define the value for an option of a custom paneAs standard, the value of the value is undefined. searchPanes.panes.options.value can be either a string or a function. If it is a string then a straight === comparison will be performed between it and the data in the table. It is worth noting that this cannot be the case for completely custom panes with no column attached to them as SearchPanes does not know what to compare it to. In this case SearchPanes must use a function. Setting searchPanes.panes.options.value to be a function allows searchPanes to use that function to search for results from the DataTable. The data from the row and the row index are passed into this function. The context is the parent DataTable. The internals of the function are down to the behaviour that you wish to create. Returning true from the function will include that row in the results, conversely false will exclude the row. Having the value property as a function means that comparisons can be made at a variety of different levels of complexity, all completely open to the developers needs. The example below shows a very simple function which compares data from multiple columns.searchPanes.panes.options.className› Add classes to specific options of a custom paneAs standard, the value of the className is undefined. Setting searchPanes.panes.options.className to a string value will set the class of the row for the option in the custom pane. This is useful for adding custom styling to specific rows.
Examples
- SearchPanes › Internationalisation Language OptionsThis example shows how the internationalisation functionality built into dataTables can be used to show how many filters have been applied in the title section. Values can be defined for individual values like '0' with '_' being for the rest.
- SearchPanes › Custom Filtering OptionsThis example shows how to set up a custom comparison function in SearchPanes.
- SearchPanes › Using Render Function to Create Custom OptionsThis is the searchPanes extension for DataTables. It allows results to be filtered based on the values of columns. This example demonstrates searching on rendered data. The
searchPanes.columnsproperty is set to5so that only the Salary column is displayed as a pane. - SearchBuilder › Language OptionsThis example demonstrates how to set the value of the following language properties:
language.searchBuilder.addlanguage.searchBuilder.conditionlanguage.searchBuilder.clearAlllanguage.searchBuilder.deletelanguage.searchBuilder.deleteTitlelanguage.searchBuilder.datalanguage.searchBuilder.leftlanguage.searchBuilder.leftTitlelanguage.searchBuilder.logicAndlanguage.searchBuilder.logicOrlanguage.searchBuilder.rightlanguage.searchBuilder.rightTitlelanguage.searchBuilder.titlelanguage.searchBuilder.value - Editor › Editing options - submit full row dataBy default, when using inline editing, Editor will submit only the value of the field that has been edited (with no Ajax submission happening if the value has not changed). This behaviour is controlled by the
form-optionsobject that is passed into theinline()method, or theformOptions.inlineinitialisation option and has three modes of operation:changed- Submit only the changed field (the default for inline editing), and only if the value has changedallIfChanged- Submit the values of all fields if one or more have changed. If none have changed, nothing will be submittedall- Submit all field values, even if there are no changes. This example demonstrates theallIfChangedoption, which can be useful if you need to perform calculations on the server-side based on information in the row, regardless of which field value was altered. The effect of this parameter can be observed in the Submitted data section of the Ajax data tab below the table where you will see the full data for a row after editing a field. - Editor › Options - week numbersIt can often be useful to see at a glance what week of the year a week falls into - this option is provided in the
datetimecalendar picker through theshowWeekNumberoption which is specified as part of anopts(i.e. options) object. This example shows the week number enabled for the date picker using a simple ISO8601 date format. - Editor › Options - disable daysIt can sometimes be useful to not allow selection of particular days - the
datetimefield provides that ability through thedisableDaysoption. It can be provided as an array of day numbers in the week to disable (Sunday = 0, Monday = 1, etc) or as a function to provide more fine grained control. This example shows thedisableDaysoption being used to disable date selection on Saturdays and Sundays. Note that validation of this information should also be performed at the server-side since it is possible for the end user to type in an invalid date, rather than using the calendar picker. - Buttons › Export options - row selectorBy default, the export buttons (including Print) will automatically detect if any rows are selected (by the Select extension for DataTables) and only export the data from those selected rows. If no rows are selected, all rows will be exported. If you wish to customise this behaviour, you can use the
exportOptionsobject to determine what columns and rows are included in the printed data. A DataTablesselector-modifierobject can be given using theexportOptions.modifieroption and has the ability to determine the order of the print table and if filtering rows are included, among other actions. In this example the Select extension is used to give the end user the ability to select rows by clicking on them. Two print buttons are utilised in this example to demonstrate theexportOptionsoption: The first button will print all rows (after filtering). This is done by setting theselectedmodifier to benull. The second button will print only the selected rows.
Forum
- 9th Nov 2022SearchPane - Pre-populate with optionsYou can define custom options using columns.searchPanes.options (example here)
- 11th Oct 2022Options doc page Group section Buttons filter shows nothingOptions docs Group Buttons shows
- 22nd Sep 2022Load values from an api call as "select" options on "New" button click modalYou mean for Editor's select field type? Use the field().update() method to update the options. Allan
- 24th Aug 2022How could I get this current row and use it in a where clause (for options)The options instance can't do left
- 29th Jul 2022Conditional Options on Editor Fielddependant()'s return value can include an options parameter, or you could call field().update() directly on the field in question: editor.dependent( 'mytable.status', function ( val ) { if (val === 'APPROVED') { editor.field('mytable.status').update([ { label: "A", value: "A" }, { label: "B", value: "B" }, ]); } } ); Allan
- 6th Jul 2022mjoin options field more than 2 fields on insert/updateall the normal datatable options are available for it?
- 2nd Jul 2022Editor select field with options from HTML (or rather PHP)Yup - that will do it nicely if you can get the options via Ajax like that. Allan
- 14th Jun 2022[SearchPanes]: Invalid pane options are still restored when serverSide: true (e.it #314)Hi @allan, got it working. The serverside script simply has to return all selected options from the request variable searchPanes with count and total set to 0. Thanks, Pascal
- 19th May 2022How to disable the Dropdown options in DataTable Editor?and then manipulate its options as required - e.g.: editor.field('selections').input().find('option[value=xyz]').prop('disabled',
- 27th Apr 2022Filter button breaks when using Bootstrap and SearchPanes optionsto put the SearchPanes options like for example: viewTotal: