Hanterar dynamisk uppdatering av innehållet i rullgardinsmenyn

smartassist/src/static/js/frontend.js

@@ -66,7 +66,7 @@ const frontendApi = {
       // Populate the dropdown menu with received data
       data.forEach(endpoint => {
         const linkElement = document.createElement('a');
-        linkElement.href = '#';
+        linkElement.href = '';  // If attribute is set to '#', browser scrolls to top of page and reload
         linkElement.onclick = () => frontendApi.setEndpointAndLlm(endpoint.endpoint, endpoint.llm);
         linkElement.textContent = `${endpoint.endpoint} - ${endpoint.llm}`;
         
@@ -111,6 +111,19 @@ document.addEventListener('keyup', function() {
   sendButton.style.backgroundColor = ''; // Restore the original style when any key is released
 });
 
+// Get the dropdown button and the dropdown content elements
+const dropbtn = document.getElementById('selected-endpoint');
+const dropdownContent = document.getElementById('endpoint-dropdown');
+
+// Add event listeners to each dropdown item
+dropdownContent.addEventListener('click', (e) => {
+    if (e.target.tagName === 'A') { // Only respond to clicks on anchor tags
+        e.preventDefault(); // Prevent default link behavior
+        const selectedEndpoint = e.target.textContent;
+        dropbtn.textContent = selectedEndpoint; // Update the button's text
+        // You can also add code here to update the current endpoint in your application
+    }
+});
 
 function init() {
   // Other initialization code here...