mirror of
https://github.com/netbox-community/netbox.git
synced 2025-08-13 02:58:17 -06:00
Addressed PR comments
This commit is contained in:
parent
f48cece10f
commit
5fa9cbc4a9
BIN
netbox/project-static/dist/netbox.js
vendored
BIN
netbox/project-static/dist/netbox.js
vendored
Binary file not shown.
BIN
netbox/project-static/dist/netbox.js.map
vendored
BIN
netbox/project-static/dist/netbox.js.map
vendored
Binary file not shown.
@ -1,6 +1,5 @@
|
|||||||
import { isTruthy } from './util';
|
import { isTruthy } from './util';
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Show/hide quicksearch clear button.
|
* Show/hide quicksearch clear button.
|
||||||
*
|
*
|
||||||
@ -10,52 +9,66 @@ function quickSearchEventHandler(event: Event): void {
|
|||||||
const quicksearch = event.currentTarget as HTMLInputElement;
|
const quicksearch = event.currentTarget as HTMLInputElement;
|
||||||
const inputgroup = quicksearch.parentElement as HTMLDivElement;
|
const inputgroup = quicksearch.parentElement as HTMLDivElement;
|
||||||
if (isTruthy(inputgroup)) {
|
if (isTruthy(inputgroup)) {
|
||||||
if (quicksearch.value === '') {
|
if (quicksearch.value === "") {
|
||||||
inputgroup.classList.add('hide-last-child');
|
inputgroup.classList.add("hide-last-child");
|
||||||
|
clearLinkParams();
|
||||||
} else {
|
} else {
|
||||||
inputgroup.classList.remove('hide-last-child');
|
inputgroup.classList.remove("hide-last-child");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clear the existing search parameters in the link to export Current View.
|
||||||
|
*/
|
||||||
|
function clearLinkParams(): void {
|
||||||
|
const link = document.getElementById("current_view") as HTMLLinkElement;
|
||||||
|
let linkUpdated = link?.href.split("&")[0];
|
||||||
|
link.setAttribute("href", linkUpdated);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Update the Export View link to add the Quick Search parameters.
|
* Update the Export View link to add the Quick Search parameters.
|
||||||
* @param event
|
* @param event
|
||||||
*/
|
*/
|
||||||
|
|
||||||
function handleQuickSearchParams(event: Event): void {
|
function handleQuickSearchParams(event: Event): void {
|
||||||
console.log('getParams');
|
|
||||||
const quickSearchParameters = event.currentTarget as HTMLInputElement;
|
const quickSearchParameters = event.currentTarget as HTMLInputElement;
|
||||||
const link = document.getElementById('current_view') as HTMLLinkElement;
|
|
||||||
|
// Clear the existing search parameters
|
||||||
|
clearLinkParams();
|
||||||
|
|
||||||
if (quickSearchParameters != null) {
|
if (quickSearchParameters != null) {
|
||||||
|
const link = document.getElementById("current_view") as HTMLLinkElement;
|
||||||
const search_parameter = `q=${quickSearchParameters.value}`;
|
const search_parameter = `q=${quickSearchParameters.value}`;
|
||||||
const linkUpdated = link?.href + '&' + search_parameter;
|
const linkUpdated = link?.href + "&" + search_parameter;
|
||||||
link.setAttribute('href', linkUpdated);
|
link.setAttribute("href", linkUpdated);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Initialize Quicksearch Event listener/handlers.
|
* Initialize Quicksearch Event listener/handlers.
|
||||||
*/
|
*/
|
||||||
export function initQuickSearch(): void {
|
export function initQuickSearch(): void {
|
||||||
const quicksearch = document.getElementById('quicksearch') as HTMLInputElement;
|
const quicksearch = document.getElementById("quicksearch") as HTMLInputElement;
|
||||||
const clearbtn = document.getElementById('quicksearch_clear') as HTMLButtonElement;
|
const clearbtn = document.getElementById("quicksearch_clear") as HTMLButtonElement;
|
||||||
|
|
||||||
if (isTruthy(quicksearch)) {
|
if (isTruthy(quicksearch)) {
|
||||||
quicksearch.addEventListener('keyup', quickSearchEventHandler, {
|
quicksearch.addEventListener("keyup", quickSearchEventHandler, {
|
||||||
passive: true,
|
passive: true,
|
||||||
});
|
});
|
||||||
quicksearch.addEventListener('search', quickSearchEventHandler, {
|
quicksearch.addEventListener("search", quickSearchEventHandler, {
|
||||||
passive: true,
|
passive: true,
|
||||||
});
|
});
|
||||||
quicksearch.addEventListener('change', handleQuickSearchParams);
|
quicksearch.addEventListener("change", handleQuickSearchParams);
|
||||||
|
|
||||||
if (isTruthy(clearbtn)) {
|
if (isTruthy(clearbtn)) {
|
||||||
clearbtn.addEventListener(
|
clearbtn.addEventListener(
|
||||||
'click',
|
"click",
|
||||||
async () => {
|
async () => {
|
||||||
const search = new Event('search');
|
const search = new Event("search");
|
||||||
quicksearch.value = '';
|
quicksearch.value = "";
|
||||||
await new Promise(f => setTimeout(f, 100));
|
await new Promise(f => setTimeout(f, 100));
|
||||||
quicksearch.dispatchEvent(search);
|
quicksearch.dispatchEvent(search);
|
||||||
},
|
},
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
<div class="input-group input-group-sm me-2 quicksearch hide-last-child">
|
<div class="input-group input-group-sm me-2 quicksearch hide-last-child">
|
||||||
<input type="search" results="5" name="q" class="form-control" placeholder="Quick search" id="quicksearch"
|
<input type="search" results="5" name="q" class="form-control" placeholder="Quick search" id="quicksearch"
|
||||||
hx-get="{{ request.full_path }}" hx-target="#object_list"
|
hx-get="{{ request.full_path }}" hx-target="#object_list"
|
||||||
hx-trigger="keyup changed delay:500ms, search" hx-ext="push-url-w-params" />
|
hx-trigger="keyup changed delay:500ms, search" />
|
||||||
<button class="btn bg-transparent" type="button" id="quicksearch_clear"><i class="mdi mdi-close-circle"></i>
|
<button class="btn bg-transparent" type="button" id="quicksearch_clear"><i class="mdi mdi-close-circle"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
Reference in New Issue
Block a user