Problem storing HTML combobox label

Asked

Viewed 32 times

1

I have the following HTML combobox:

var concelhos = $('select[name="Concelho"] option');
    $('select[name="Distrito"]').on('change', function () {
        var Distrito = this.value;
        var novoSelect = concelhos.filter(function () {
            return $(this).data('distrito') == Distrito;
        });
        $('select[name="Concelho"]').html(novoSelect);
    });


function mudouValor() {
      var elemento = document.getElementById('COMBOFAB');
      var texto = elemento.options[elemento.selectedIndex].innerHTML;
      document.getElementById("nome_unidade").value = texto;
 }
 
 mudouValor();
 <span class="IWLABEL11CSS" id="IWLABEL7">Órgão: </span>
<select name="Distrito" size="1" width="195" class="COMBOCONCCSS" id="COMBOCID" tabindex="1">
<option value="00">Todos os Órgãos</option>
<option value="01">Câmara Municipal</option>
<option value="02">Gabinete do Prefeito</option>
<option value="03">Secretaria Municipal de Governo</option>
<option value="04">Assessoria de Comunicação Social</option>
<option value="05">Procuradoria Jurídica</option>
<option value="06">Ouvidoria Municipal</option>
<option value="07">Secretaria Municipal de Administração</option>
<option value="08">Secretaria Municipal de Planejamento</option>
<option value="09">Secretaria Municipal da Fazenda</option>
<option value="10">Secretaria Municipal de Saúde</option>
<option value="11">Secretaria Municipal de Desenvolvimento Econônomico</option>
<option value="12">Secretaria Municipal de Obras</option>
<option value="13">Secretaria Municipal de Ação Social</option>
<option value="14">Secretaria Municipal de Desenvolvimento Urbano e Meio Ambiente</option>
<option value="15">Secretaria Municipal de Esporte e Lazer</option>
<option value="16">Secretaria Municipal de Educação</option>
<option value="17">Secretaria Municipal de Agricultura</option>
<option value="18">Secretaria Municipal de Auditoria</option>
</select> 
<br><br>
                                    
<span class="IWLABEL11CSS" id="IWLABEL7">Unidade: </span>
<select name="Concelho" size="1" width="195" class="COMBOCONCCSS" id="COMBOCID" tabindex="1" onchange="mudouValor();">
<option data-distrito="00" value="00">Todas as Unidades</option>
<option data-distrito="01" value="01">Câmara Municipal</option>
<option data-distrito="02" value="01">Gabinete do Prefeito</option>
<option data-distrito="03" value="01">Secretaria Municipal de Governo</option>
<option data-distrito="04" value="01">Assessoria de Comunicação Social</option>
<option data-distrito="05" value="01">Procuradoria Jurídica</option>
<option data-distrito="06" value="01">Ouvidoria Municipal</option>
<option data-distrito="07" value="01">Secretaria Municipal de Administração</option>
<option data-distrito="07" value="02">FUNCAPI - Fundo Comlp. Aposent. Pensão do Servidor Público</option>
<option data-distrito="08" value="01">Secretaria Municipal de Planejamento</option>
<option data-distrito="09" value="01">Secretaria Municipal da Fazenda</option>
<option data-distrito="10" value="01">Fundo Municipal de Saúde</option>
<option data-distrito="11" value="01">Secretaria Municipal Desenvolvimento Econômico e Turismo</option>
<option data-distrito="12" value="01">Secretaria Municipal de Obras</option>
<option data-distrito="13" value="01">Secretaria Municipal de Ação Social</option>
<option data-distrito="13" value="02">Fundo Municipal de Assistência Social</option>
<option data-distrito="13" value="03">Fundo Municipal dos Direitos da Criança e do Adolescente</option>
<option data-distrito="14" value="01">Secretaria Municipal de Desenvolvimento Urbano e Meio Ambiente</option>
<option data-distrito="15" value="01">Secretaria Municipal de Esporte e Lazer</option>
<option data-distrito="16" value="01">Fundo de Manutenção do Ensino Fundamental de Valorização do Magisterio - FUNDEF</option>
<option data-distrito="16" value="02">Secretaria Municipal de Educação</option>                                        
<option data-distrito="17" value="01">Secretaria Municipal de Agricultura e Abastecimento</option>
<option data-distrito="18" value="01">Secretaria Municipal e Auditoria Interna e Controladoria</option>
</select>

I expected label to receive the label of the combobox, but it is not happening, what would be the problem?

1 answer

2


Just call the function you created in the event onchange of your select. I took the Hidden type from your input only to display the result.

function mudouValor() {
      var elemento = document.getElementById('COMBOFAB');
      var texto = elemento.options[elemento.selectedIndex].innerHTML;      
      //altera o valor do campo cujo o id seja igual a "label"
      document.getElementById("label").value = texto;
 }
 
 mudouValor();
<span class="IWLABEL11CSS" id="IWLABEL7">Mês da emissão: </span>
<select name="Mes" size="1" width="180" class="COMBODISTCSS" id="COMBOFAB" tabindex="1" onchange="mudouValor();">
  <option value="1" selected>Janeiro</option>
  <option value="2">Fevereiro</option>
  <option value="3">Março</option>
  <option value="4">Abril</option>
  <option value="5">Maio</option>
  <option value="6">Junho</option>
  <option value="7">Julho</option>
  <option value="8">Agosto</option>
  <option value="9">Setembro</option>
  <option value="10">Outubro</option>
  <option value="11">Novembro</option>
  <option value="12">Dezembro</option>
</select>
<input type="text" name="label" id="label" readonly/>

  • Ita iron kkkkkk like I didn’t notice this? thank you very much!

  • could you make one more question quick? how do I start with January selected?

  • Add the Selected attribute to his option

  • <option Selected value="1">January</option> ?

  • That, but note that it will not fire onchange to popular your ipunt

  • and how it would be possible to fire it?

  • 1

    You can simply add Selected to the option and call its function mudouValor(), for example in the page load. See the edit of my reply.

  • If instead of being a text, I need to activate another combobox, it will be the same way (firing on the page load)?

  • I don’t understand exactly what you want to do

  • Suppose that for each month we will have 3 different options to be selected in the second combobox, selected January, the second combobox will appear A, B and C, selected February, will appear D, E and F... that I have already managed to do, only left to shoot the page load, already starting with January (I’m already calling the function in the same way as the example)

  • I edited there on the question, but I could not make it work here... but in my application is working

  • This is already a totally different question and can still be considered very broad.

Show 7 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.