Select open window with bank options

Question

Select open window with bank options

Navigation

#1 by (0 votes)
#2 by (0 votes)

1

I need a help, I have a code that when clicking on checkbox a window would appear, if it disappears the window disappears, so far so good, but now, it will not be a% will display the window.

It will be a checkbox and your options should come from the database (Postgre).

I have to get the 3 options that come from the bank and put to open and close this window.

This is my select:

<div class="es2 col-md-6">
   <label class="lb">
      Nacionalidade
   </label>
   <select ng-model="pessoa.pessoasFisicas.nacionalidade.idNacionalidade" ng-options="nac.idNacionalidade as nac.descricao for nac in nacionalidades " class=" js-example-theme-single1"  style="width: 100%; margin-top: -3px;" placeholder="Digite aqui nacionalidade">
      <option  ></option>
   </select>
</div>

These are the windows that have to open and close in case they are tabs.

<li>
   <a data-toggle="tab"   id="tabEstrangeiro"  data-target="#estrangeiro">
       Estrangeiro
   </a>
</li>
<li>
   <a data-toggle="tab"  id="tabNaturalizado"  data-target="#naturalizado">
      Naturalizado
   </a>
</li>

javascript html jquery angularjs

asked by anonymous 30.01.2018 / 14:30

2 answers

Hello I'm starting to fiddle with HTML and CSS now Reading txt file to memory

score 0 · Answer 1

0

Yes, I do not know what to do, but I do not know what to do with this option. to disappear

30.01.2018 / 15:47

score 0 · Answer 2

The following code should help you, any questions or missing parts, just let me know:

function selectMudou() {
  var select = document.getElementById('opcoes');
  switch ( select.options[select.selectedIndex].text ) {
    case 'Opção 1': // caso seja a opção 1
      document.getElementById('tabEstrangeiro').style.display = 'none';
      document.getElementById('tabNaturalizado').style.display = 'initial';
      break;
    case 'Opção 2': // caso seja a opção 2
      document.getElementById('tabEstrangeiro').style.display = 'initial';
      document.getElementById('tabNaturalizado').style.display = 'none';
      break;
    case 'Opção 3': // caso seja a opção 3
      document.getElementById('tabEstrangeiro').style.display = 'none';
      document.getElementById('tabNaturalizado').style.display = 'none';
      break;
  }
}

#esconder {
  display: none;
}

<select id="opcoes" onchange="selectMudou()">
  <option id="esconder">Escolhe</option>
  <option>Opção 1</option>
  <option>Opção 2</option>
  <option>Opção 3</option>
</select>
<li>
  <a data-toggle="tab" id="tabEstrangeiro" data-target="#estrangeiro">Estrangeiro</a>
</li>
<li>
  <a data-toggle="tab" id="tabNaturalizado" data-target="#naturalizado">Naturalizado</a>
</li>

Edited (function to change options):

function mudarOpcoes(novasOpcoes) {
  var select = document.getElementById('opcoes');
  var opcoes = select.getElementsByTagName('option');
  for ( let i = 0; i < opcoes.length - 1; i++ ) {
    opcoes[i + 1].innerText = novasOpcoes[i];
  }
}

var novasOpcoes = ['Dados', 'da', 'BD'];

mudarOpcoes(novasOpcoes);

#esconder {
  display: none;
}

<select id="opcoes" onchange="selectMudou()">
  <option id="esconder">Escolhe</option>
  <option>Opção 1</option>
  <option>Opção 2</option>
  <option>Opção 3</option>
</select>