Closes #6808: Determine option disabled status via disabled-indicator attribute

This commit is contained in:
checktheroads 2021-07-30 00:56:54 -07:00
parent d18c83beb0
commit 5463fa7390
3 changed files with 29 additions and 10 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -123,6 +123,11 @@ class APISelect {
*/ */
private disabledOptions: Array<string> = []; private disabledOptions: Array<string> = [];
/**
* Array of properties which if truthy on an API object should be considered disabled.
*/
private disabledAttributes: Array<string> = DISABLED_ATTRIBUTES;
constructor(base: HTMLSelectElement) { constructor(base: HTMLSelectElement) {
// Initialize readonly properties. // Initialize readonly properties.
this.base = base; this.base = base;
@ -141,6 +146,7 @@ class APISelect {
this.loadEvent = new Event(`netbox.select.onload.${base.name}`); this.loadEvent = new Event(`netbox.select.onload.${base.name}`);
this.placeholder = this.getPlaceholder(); this.placeholder = this.getPlaceholder();
this.disabledOptions = this.getDisabledOptions(); this.disabledOptions = this.getDisabledOptions();
this.disabledAttributes = this.getDisabledAttributes();
this.slim = new SlimSelect({ this.slim = new SlimSelect({
select: this.base, select: this.base,
@ -335,7 +341,7 @@ class APISelect {
data[key] = String(v); data[key] = String(v);
} }
// Set option to disabled if the result contains a matching key and is truthy. // Set option to disabled if the result contains a matching key and is truthy.
if (DISABLED_ATTRIBUTES.some(key => key.toLowerCase() === k.toLowerCase())) { if (this.disabledAttributes.some(key => key.toLowerCase() === k.toLowerCase())) {
if (typeof v === 'string' && v.toLowerCase() !== 'false') { if (typeof v === 'string' && v.toLowerCase() !== 'false') {
disabled = true; disabled = true;
} else if (typeof v === 'boolean' && v === true) { } else if (typeof v === 'boolean' && v === true) {
@ -546,6 +552,19 @@ class APISelect {
return disabledOptions; return disabledOptions;
} }
/**
* Get this element's disabled attribute keys. For example, if `disabled-indicator` is set to
* `'_occupied'` and an API object contains `{ _occupied: true }`, the option will be disabled.
*/
private getDisabledAttributes(): string[] {
let disabled = [...DISABLED_ATTRIBUTES] as string[];
const attr = this.base.getAttribute('disabled-indicator');
if (isTruthy(attr)) {
disabled = [...disabled, attr];
}
return disabled;
}
/** /**
* Parse the `data-url` attribute to add any Django template variables to `pathValues` as keys * Parse the `data-url` attribute to add any Django template variables to `pathValues` as keys
* with empty values. As those keys' corresponding form fields' values change, `pathValues` will * with empty values. As those keys' corresponding form fields' values change, `pathValues` will