The search toolbar content should be replaced by the clicked result

[arno974]

When using the search toolbar (e.g. with lizmap search) do you think it would be a good idea to replace the current content inside the search toolbar by the text content from the result clicked by the user ?

Exemple :

1. a user search the parcel AB145 and start typing AB14
2. many results are displayed in the search toolbar (e.g. AB14, AB142, AB145, AB146)
3. the user clicks on AB145 but the content in the search toolbar is still AB14
4. My suggestion is to replace AB14 by the text clicked by the user (AB145)

[sudhanshu112233shukla]

Hi, I have implemented a fix for this issue by ensuring that when a user clicks on a search result, the search bar content is updated dynamically. The solution uses a modular JavaScript class with event delegation for performance optimization. It also includes error handling to prevent crashes.

( we can apply it without modifying core logic )

class LizmapSearchUpdater {
constructor(searchInputSelector, searchResultSelector) {
this.searchInput = document.querySelector(searchInputSelector);
this.searchResultSelector = searchResultSelector;
this.init();
}

init() {
    if (!this.searchInput) {
        console.error("Search input field not found!");
        return;
    }
    this.addResultClickListeners();
}

addResultClickListeners() {
    document.addEventListener("click", (event) => {
        const clickedElement = event.target.closest(this.searchResultSelector);
        if (clickedElement) {
            this.updateSearchBar(clickedElement.textContent.trim());
        }
    });
}

updateSearchBar(value) {
    this.searchInput.value = value;
}

}

// Initialize the search updater for Lizmap
document.addEventListener("DOMContentLoaded", () => {
new LizmapSearchUpdater("#lizmapSearchInput", ".lizmap-search-result");
});