Widget:Agatha-test: mudanças entre as edições

sem sumário de edição
Sem resumo de edição
Sem resumo de edição
 
(8 revisões intermediárias pelo mesmo usuário não estão sendo mostradas)
Linha 20: Linha 20:
       <ul class="selectwithSearch__options"></ul>
       <ul class="selectwithSearch__options"></ul>
     </div>
     </div>
  </div>
</div>
 
<div class="mt-2">
<img src="" class="margin-center d-none" style="border-radius: 6px" alt="Imagem do resultado da pesquisa" id="img-select" />
<p class="text-center" id="obs-select"></p>
</div>


<script>
<script>
Linha 38: Linha 43:


         option.phrases.map(phrase => {
         option.phrases.map(phrase => {
             let li = `<li onclick="updateName('${option.group}')"> ${phrase} </li>`;
             let li = `<li onclick="updateName('${option.group}', '${option.img}', '${option.obs}')"> ${phrase} </li>`;
             options.insertAdjacentHTML("beforeend", li);
             options.insertAdjacentHTML("beforeend", li);
         });
         });
Linha 46: Linha 51:
addOptions();
addOptions();


function updateName(selectedValue) {
function updateName(selectedValue, img, obs) {
     searchInp.value = "";
     searchInp.value = "";
     addOptions(selectedValue);
     addOptions(selectedValue);
     wrapper.classList.remove("active");
     wrapper.classList.remove("active");
    document.querySelector('#img-select').src = window.location.origin + img;
    document.querySelector('#img-select').classList.remove('d-none');
    document.querySelector('#img-select').classList.add('d-block');
    document.querySelector('#obs-select').innerHTML = obs;
     selectBtn.firstElementChild.innerText = selectedValue;
     selectBtn.firstElementChild.innerText = selectedValue;
    console.log(optionsValues.filter(curr => curr.group === selectedValue))
}
}


Linha 65: Linha 73:


         html += `<li class="groupTitle ${isSelected}"> ${option.group} </li>`;
         html += `<li class="groupTitle ${isSelected}"> ${option.group} </li>`;
         option.phrases.filter(curr => curr.toLowerCase().startsWith(searchWord)).map(phrase => {
         option.phrases.filter(curr => curr.toLowerCase().startsWith(searchWord)).map(phrase => {
             html += `<li onclick="updateName('${option.group}')"> ${phrase} </li>`;
             html += `<li onclick="updateName('${option.group}', '${option.img}', '${option.obs}')"> ${phrase} </li>`;
         });
         });