https://www.biella.ch/js/header/language_type.js

1const langue = {
2
3    choice: () => {
4        let select;
5
6        select = document.querySelectorAll('[data-langue]');
7        for (let i = 0; i < select.length; i++){
8            select[i].addEventListener('change', function (){
9                let form = this.closest("form");
10                form.submit();
11            });
12        }
13    },
14
15    search: () => {
16        const search1 = document.querySelector("#search-nav_search[data-mobile=non-mobile]");
17        const langue = document.querySelector("[data-languesite]");
18        const dataList = document.getElementById("search-data-nav");
19        let tableau = {};
20        search1.addEventListener("keyup", (e) => {
21
22            if (e.key !== "Backspace"){
23
24                let requete = "/de/api/search/"+ langue.dataset.languesite +"/" + search1.value;
25                fetch(requete,
26                    {
27                        mode: "cors",
28                        cache: "default",
29                        method: 'GET',
30                        headers: {
31                            'Accept' : 'application/json',
32                        },
33                    })
34                    .then((response) => {
35                        return response.json();
36                    })
37                    .then((list) => {
38                        let i = 0;
39                        tableau = [];
40                        for(let data in list){
41                            if (!tableau.includes(list[data])){
42                                tableau[i] = list[data];
43                                i++;
44                            }
45                        }
46                    })
47                ;
48            }
49
50            if (e.key === "Backspace") {
51                for (let i = 0; i < dataList.children.length;i++){
52                    dataList.removeChild(dataList.children[i]);
53                }
54            }
55
56            if (e.key !== "Backspace"){
57                for (let i = 0; i < dataList.children.length;i++){
58                    dataList.removeChild(dataList.children[i]);
59                }
60
61                for(let i = 0; i < tableau.length;i++){
62
63                    let option = document.createElement("option");
64                    option.setAttribute("value", tableau[i]);
65                    dataList.appendChild(option);
66                }
67            }
68
69        });
70    },
71
72    init: function(){
73        langue.choice();
74        dropdown.dropdown();
75        dropdown.enterBlock();
76        responsive.KingSteakHouse();
77        responsive.CloseSteakHouse();
78        langue.search();
79    },
80
81    resetSize: function(){
82
83        window.addEventListener('resize', function (){
84
85            if(screen.width >= 992){
86                responsive.navbar.classList.remove('menu-navbar-burger-active');
87                responsive.burger.classList.remove('not-active-burger');
88            }
89
90        })
91    }
92}
93
94document.addEventListener('DOMContentLoaded', langue.resetSize);
95document.addEventListener('DOMContentLoaded', langue.init);