-2

Gostaria de desabilitar o textarea caso o select esteja como false, e habilitar caso o select esteja como true. Eu estava tentando fazer pelo DOM, porém não obtive êxito, abaixo esta o código que possuo, caso alguém possa me ajudar.

                <div class="row">
                  <div class="col-sm-12 col-lg-6">
                      <div class="form-group">
                          <label>Banner Ad:</label> <i class="fa fa-info-circle" data-toggle="tooltip" title="Enable or disable Banner Ad"></i>
                          <select name="controls" class="form-control">
                          <option <?php if($list_settings['controls'] == 'true') echo 'selected' ?> value="true">Enabled</option>
                          <option  <?php if($list_settings['controls'] == 'false') echo 'selected' ?> value="false">Disabled</option>
                          </select>
                      </div>
                  </div>
                    <div class="col-sm-12 col-lg-12">
                        <div class="form-group">
                            <label>Ad Code:</label> <i class="fa fa-info-circle" data-toggle="tooltip" title="Enter your ad code here"></i>
                            <textarea name="banner_ad_code" class="form-control" value=""></textarea>
                        </div>
                    </div>
                    <div class="col-sm-12 col-lg-4">
                        <div class="form-group">
                            <button type="submit" name="upgrade" class="btn btn-primary btn-sm">Save Settings</button>
                        </div>
                    </div>
            </div>

2 Respostas 2

0

Para manipulação de estados do DOM é recomendado que você utilize javascript ao invés de PHP. Como você colocou uma tag de jQuery, acredito que já conheça a biblioteca, segue um exemplo de como você poderia verificar o estado do select via jQuery:

$("#idDoDropDown").change(function(){
  if($("#idDoDropDown option:selected").text() === "Enabled"){
      
  };
});

A função ".change()" do jQuery dispara sempre que houver alteração de valor no elemento, portanto quando o usuário mexer no dropdown e selecionar algum valor ele vai executar a função, que no caso pegar o valor selecionado no dropdown e verifica se é igual a "Enabled", e dai você pode trabalhar para esconder/mostrar o textarea.

As funções show() e hide() do jQuery podem te ajudar a trabalhar na visibilidade no textarea.

2
  • certo, porem nao entendi muito bem como eu faria para desabilitar o textarea caso o valor do select estivesse em false, poderia me ajudar por favor 18/11/2018 às 0:36
  • @LeandroFalasca1 Você insere no corpo da função um show() ou hide() no text área, ex.: $("#idTextArea").hide() (esse comando irá esconder o textArea). Portanto dentro do if que coloquei de exemplo você colocar um .show() e no else desse if você colocaria o .hide() no elemento do textarea. Documentação: w3schools.com/jquery/jquery_hide_show.asp 18/11/2018 às 2:13
0
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="col-sm-12 col-lg-6">
    <div class="form-group">
        <label>Banner Ad:</label> <i class="fa fa-info-circle" data-toggle="tooltip" title="Enable or disable Banner Ad"></i>

           <?php if($list_settings['controls'] == 'true') $enabile 'selected' ?>
           <?php if (if($list_settings['controls'] == 'false') $disabile = 'selected' ?>

           <select id="controls" name="controls" class="form-control">
               <option value="true" <?php echo $enabile ?>>Enabled</option>
               <option value="false" <?php echo $disabile ?>>Disabled</option>
           </select>
    </div>
</div>
<div class="col-sm-12 col-lg-12">
    <div class="form-group">
        <label>Ad Code:</label> <i class="fa fa-info-circle" data-toggle="tooltip" title="Enter your ad code here"></i>
        <textarea id="talkbox" name="banner_ad_code" class="form-control">https://i.imgur.com/QtjFP4E.jpg</textarea>
    </div>
</div>
<div class="col-sm-12 col-lg-4">
    <div class="form-group">
        <button type="submit" name="upgrade" class="btn btn-primary btn-sm">Save Settings</button>
    </div>
</div>

<script>

$("#controls option:selected").each(function() {
   var strOption = $(this).val();

      if (stroption=="true"){
        document.getElementById('talkbox').disabled = true;
      }else{
        document.getElementById('talkbox').disabled = false;
      }
});

</script>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .