summaryrefslogtreecommitdiff
path: root/modules/luci-base/htdocs/luci-static/resources/form.js
Commit message (Collapse)AuthorAgeFilesLines
* luci-base: convert JavaScript code to ES6 stylees6Jo-Philipp Wich2023-09-261-609/+625
| | | | | | | | | | Convert existing JavaScript code in LuCI base to utilize ES6 standard features such as spread arguments, arrow functions, object method declarations etc. This makes the code somewhat easier to follow and slightly smaller. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: Fix typos in JsDocsSergey Ponomarev2023-09-231-33/+33
| | | | | | | | | | | | | | In some places argument name was renamed but in the JsDoc it's remain old. Added more typing for string enum fields like: @param {string} [type=text] replaced with: @param {"blob"|"text"|"blob"} [type=text] Signed-off-by: Sergey Ponomarev <stokito@gmail.com>
* luci-base: "an URL" replace with "a URL"Sergey Ponomarev2023-09-231-1/+1
| | | | | | This is a correct form Signed-off-by: Sergey Ponomarev <stokito@gmail.com>
* luci-base: form.js: reuse JSONMap data provider in GridSection modalsJo-Philipp Wich2023-02-041-3/+6
| | | | | | | | | Reuse the same data provider as the parent JSONMap instance in order to avoid inadvertently mangling the form data when saving the modal edit dialog. Fixes: bb9ede238a ("luci-base: form.js: reuse JSONMap data provider in GridSection modals") Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: fix GridSection modals in JSONMap instancesJo-Philipp Wich2023-02-041-2/+8
| | | | | | | | | | | | | Since grid section edit modals construct a new Map instance internally, we must take care of using the correct map constructor type for the internal copy in order to end up with the correct data provider. Ensure that the extended option modal of GridSection instances uses a JSONMap when the grid section's owner map is a JSONMap to avoid stray uci related errors. Ref: https://forum.openwrt.org/t/luci-save-apply/149658/5 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: help-text spell fixPaul Dee2023-01-171-1/+1
| | | | Signed-off-by: Paul Dee <itsascambutmailmeanyway@gmail.com>
* luci-base: fix button handling for named sectionsFlorian Eckert2022-12-131-1/+1
| | | | | | | | | | If more than one named section is added to the page, it is currently the case, that the first button is always switched on or off during input validation of the uci section name. This is because the usage of the 'document.querySelector' function is to imprecise. Changing the search start to the element to be created, fixes this. Signed-off-by: Florian Eckert <fe@dev.tdt.de>
* luci-base: revise array sortingJo-Philipp Wich2022-07-271-8/+4
| | | | | | | | | | | | | Refactor various sort operations throughout luci-base to use the new L.naturalCompare() comparator function. This primarily ensures that embedded numbers are sorted numerically and not in a lexicographical way. It also simplifies some code as a side effect. Ref: #5899 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: fix removing just created named GridSectionJo-Philipp Wich2022-07-221-7/+6
| | | | | | | | | | | | | | | | | | Since the `handleModalSave()` handler of the GridSection class invokes `handleModalCancel()` after saving the data but before removing the `addedSection` property, the `handleModalCancel` handler incorrectly removed the uci section that has just been created. This bug didn't affect anonymous GridSections because after saving the id of the created section changes, causing the remove command to fail, but for named ones with stable section IDs, the bug manifested. Solve the issue by passing a flag to `handleModalCancel()` indicating whether the method was called from a safe operation and use it do decide whether to delete the new staged uci section or not. Fixes: #5760 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: minor tweaks for mobile stylingJo-Philipp Wich2022-05-171-3/+7
| | | | | | | - Annotate gridsection textvalue cells as CBI.DummyValue widgets - Replace `<br>` elements with newlines in `stripTags()` Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: trim option descriptionJo-Philipp Wich2022-05-161-1/+1
| | | | | | | | | | If a whitespace-only description is set on an element, the CSS :empty selector will not match, causing description icons to be shown when there's no actual content. To avoid that, trim the description string when building the element. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: remove stray `<br>` elements from section placeholderJo-Philipp Wich2022-05-161-4/+1
| | | | | | Theme CSS styles shoudl take care of introducing padding as needed. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: save parent map on opening nested modal mapJo-Philipp Wich2022-05-161-47/+54
| | | | | | | | | Before opening (rendering) a nested modal map, make sure to save the parent modal map in order to persist any structural uci changes, such as newly added anonymous sections to prevent the nested map from operating on stale values or ephemeral config section IDs. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: handle SectionValue objects in GridSection modalsJo-Philipp Wich2022-05-161-22/+52
| | | | | | | | | The existing logic for cloning section options into the modal form section container did not properly handle SectionValue objects. Introduce a new `cloneOptions()` helper to recursively traverse and properly clowning such nested sections. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: reset parent maps on returning from nested section modalJo-Philipp Wich2022-05-161-3/+13
| | | | | | | | The nested section modal might have changed values also covered/displayed by the parent map, so ensure to reload all parent maps in the current modal view stack to ensure that no stale values are shown on return. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: allow overriding section placeholder of TableSectionsJo-Philipp Wich2022-05-161-2/+1
| | | | | | | | The existing implementation was hardcoding the empty TableSection placeholder instead of invoking `renderSectionPlaceholder()` which might be overridden by various forms. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: rework stacked modal CBI map logicJo-Philipp Wich2022-05-061-7/+12
| | | | | | | | Only stack a new modal CBI map on top of the currently displayed modal one if the related map or section differs. This prevents misbehavior when switching the protocol of interfaces. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: add column sorting to TableSections and GridSectionsJo-Philipp Wich2022-02-241-2/+66
| | | | | | | Add ability to reorder TableSection and GridSection rows by clicking on column headers. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: do not execute embedded script code in stripTags()Jo-Philipp Wich2021-12-231-1/+2
| | | | | | | | | | Instead of relying on .innerHTML which executes embedded script code to parse a given HTML fragment, use dom.parse() which utilizies DOMParser() internally in order to extract textContent in a safe manner. Fixes: FS#4199 Ref: https://bugs.openwrt.org/index.php?do=details&task_id=4199 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: implement AbstractValue.retain propertyJo-Philipp Wich2021-12-091-16/+36
| | | | | | | | | The new `retain` boolean property controls whether the related option value is purged from the configuration when the dependencies of the option are not satisifed. Ref: #5579 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: allow nesting Grid and Table sectionsJo-Philipp Wich2021-11-221-26/+93
| | | | | | | | Implement a simple view stack within the modal overlay to allow the modal edit dialog of a table or grid section to render another table or grid section which recursively opens another modal edit dialog. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: show validation message in errorLukas Voegl2021-10-261-3/+21
| | | | Signed-off-by: Lukas Voegl <lvoegl@tdt.de>
* luci-base: form.js: add drag-drop sorting support for mobileJo-Philipp Wich2021-10-081-8/+166
| | | | | Fixes: #5416 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: do not add validation for named section if readonly is setFlorian Eckert2021-07-011-12/+14
| | | | Signed-off-by: Florian Eckert <fe@dev.tdt.de>
* luci-base: prevent empty field for adding new named section in JavaScriptHelge Mader2021-07-011-2/+12
| | | | | Suggested-by: Helge Mader <ma@dev.tdt.de> Signed-off-by: Florian Eckert <fe@dev.tdt.de>
* luci-base: change css class btn to cbi-buttonFlorian Eckert2021-07-011-4/+4
| | | | | | | The css class btn is only a valid input element on lua rendered pages. Use instead cbi-button for javascript rendered pages. Signed-off-by: Florian Eckert <fe@dev.tdt.de>
* luci-base: use button tag instead of input tag on named section addFlorian Eckert2021-07-011-4/+2
| | | | Signed-off-by: Florian Eckert <fe@dev.tdt.de>
* Merge pull request #4770 from nickberry17/update_DummyValueJo-Philipp Wich2021-06-021-1/+11
|\ | | | | luci-base: add new member 'hidden' to DummyValue
| * luci-base: add new member 'hidden' to DummyValueNicholas Smith2021-02-101-1/+11
| | | | | | | | Signed-off-by: Nicholas Smith <nicholas@nbembedded.com>
* | luci-base: form.js: consider aliased options in AbstractValue.remove()Jo-Philipp Wich2021-06-011-4/+26
| | | | | | | | | | | | | | | | | | If different options point to the same underlying uci option, we must only remove the uci value if none of the other alias options is active in order to prevent inactive options (due to unsatisfied depends) removing the uci value of active once on save. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* | luci-base: form.js: fix AbstractValue.textvalue() for uci list optionsJo-Philipp Wich2021-04-161-0/+3
|/ | | | | | | | | Serialize the uci list value into a space separated string before passing it to String.format() for HTML escaping. Without that change, empty strings were returned whenever the underlying uci get operation yieled an array. Fixes: #4993 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: make tooltip icon string configurableFlorian Eckert2021-01-131-0/+12
| | | | Signed-off-by: Florian Eckert <fe@dev.tdt.de>
* luci-base: add tooltip handlingFlorian Eckert2021-01-131-0/+22
| | | | Signed-off-by: Florian Eckert <fe@dev.tdt.de>
* treewide: transition div tables to actual table markupJo-Philipp Wich2020-11-271-13/+13
| | | | | | | | | Modern browsers allow decomposing table markup equally well as nested div constructs, therefor migrate our <div> table markup to actual <table> tags but keep the old table/tr/th/td CSS classes for now to allow for a smooth theme transition. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* Merge pull request #4531 from oldium/add-widget-changedJo-Philipp Wich2020-10-301-2/+2
|\ | | | | luci-base: Fix using isActive in widget-change notification.
| * luci-base: Fix using isActive in widget-change notification.Oldřich Jedlička2020-10-301-2/+2
| | | | | | | | | | | | | | | | | | | | | | The `onchange` notification handler is called too early to be able to evaluate other widget's `isActive()` status. Solve this by changing order of event handling - first register/execute `map.checkDepends` and then `onchange`. Fixes: openwrt/luci#4516. Signed-off-by: Oldřich Jedlička <oldium.pro@gmail.com>
* | luci-base: Replace legend element with h3.Oldřich Jedlička2020-10-241-2/+2
|/ | | | | | | | | The legend HTML element is allowed only as first element in fieldset, so use h3 instead, which is rendered the same within themes. Fixes #3149. Signed-off-by: Oldřich Jedlička <oldium.pro@gmail.com>
* luci-base: form.js: implement AbstractSection.getOption() helperJo-Philipp Wich2020-08-061-0/+30
| | | | | | | The `getOption()` function allows to easily obtain a reference to another option object instance within the same section. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: add cfgvalue(), formvalue() and getUIElement() helpersJo-Philipp Wich2020-08-051-0/+102
| | | | | | | | | | | This commit introduces new per-section cfgvalue(), formvalue() and getUIElement() helper functions which complement the respective per-option functions. Their intent is to simplify querying input data or obtaining UI widget instances from other options within the same section. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: add AbstractValue.onchange propertyJo-Philipp Wich2020-08-051-0/+32
| | | | | | | Introduce a new, widget agnostic onchange property which allows setting custom handler functions to react on element value changes. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: add ability to specify regular expression dependenciesJo-Philipp Wich2020-08-051-2/+9
| | | | Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: add CSS class to invalid option dismiss buttonJo-Philipp Wich2020-07-281-1/+1
| | | | Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: don't destroy modal form on invalid values when savingJo-Philipp Wich2020-07-281-1/+1
| | | | Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: fix handling of array sections in JSONMap formsJo-Philipp Wich2020-06-141-11/+11
| | | | Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: forward section ID in CBISectionValue methodsJo-Philipp Wich2020-05-041-4/+4
| | | | | | | This is useful for custom subclasses that want to perform conditional rendering of contents, depending on the parent section ID. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: toggle inactive CSS class on unsatisfied field cellsJo-Philipp Wich2020-04-281-0/+4
| | | | Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: ListValue: support widget and orientation propertiesJo-Philipp Wich2020-04-281-0/+26
| | | | Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: allow secondary configs to fail loadingJo-Philipp Wich2020-04-281-5/+8
| | | | | Ref: https://forum.openwrt.org/t/luci-rpc-error/61760 Signed-off-by: Jo-Philipp Wich <jo@mein.io>
* luci-base: form.js: allow to disable descriptions row in TableSectionAnton Kikin2020-04-191-1/+11
| | | | | | | Add 'nodescriptions' property to the TableSection class that allows to disable displaying table header row with descriptions. Signed-off-by: Anton Kikin <a.kikin@tano-systems.com>
* luci-base: form.js: fix TableSection descriptions row renderingAnton Kikin2020-04-191-1/+1
| | | | | | | | | | | In some cases, a table cell at actions column of a descriptions row may not be rendered. For example, this happens for GridSection when sorting is disabled: s = m.section(form.GridSection, 'section_type'); s.sortable = false; Signed-off-by: Anton Kikin <a.kikin@tano-systems.com>