Home > Mobile >  Show textbox when dropdownlist field option is selected
Show textbox when dropdownlist field option is selected

Time:01-28

In the dropdownlist field when option Jiná společnost: is selected I need to show that the JinaSpolecnostTextBox textbox

Can you help me?

$('[PrimaGroupList]').change(function() {
  var SelectedValue = $('[PrimaGroupList]').val();
  if (SelectedValue == "Jiná společnost:")
    $("#JinaSpolecnost").show();
  else
    $("#JinaSpolecnost").hide();
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div>
  <div  id="Bod1">
    <div >
      <label for="DropDownList1">Vyberte z možnost&#237;</label> *
      <select  data-val="true" data-val-required="Vyplňte toto pole." name="[PrimaGroupList]" tabindex="1">
        <option value="FTV Prima, spol. s r. o.">FTV Prima, spol. s r. o.</option>
        <option value="MEDIA CLUB, s.r.o.">MEDIA CLUB, s.r.o.</option>
        <option value="PRIMA GROUP MANAŽERSKÁ, a.s.">PRIMA GROUP MANAŽERSK&#193;, a.s.</option>
        <option value="PRIMA DOMA MEDIA, s.r.o.">PRIMA DOMA MEDIA, s.r.o.</option>
        <option value="CAR PR MEDIA, s.r.o.">CAR PR MEDIA, s.r.o.</option>
        <option value="Prima produkce, s.r.o.">Prima produkce, s.r.o.</option>
        <option value="PLAYzone s.r.o.">PLAYzone s.r.o.</option>
        <option value="PLAYPRESS s.r.o.">PLAYPRESS s.r.o.</option>
        <option value="RADIO UNITED BROADCASTING s.r.o.">RADIO UNITED BROADCASTING s.r.o.</option>
        <option value="Jiná společnost:">Jin&#225; společnost (uveďte)</option>
        <option selected="selected" value=""></option>
      </select>
    </div>
    <div  id="JinaSpolecnost" style="display:none">
      <label for="[JinaSpolecnostTextBox]" class=>N&#225;zev jin&#233; společnosti</label> *
      <input  data-showSuggestionsOnClick="true" data-val="true" data-val-required="Vyplňte toto pole." name="[JinaSpolecnostTextBox]" placeholder="" tabindex="1" type="text" value="" /><input name="[JinaSpolecnostTextBox].IsHtml"
        type="hidden" value="True" /><input name="[JinaSpolecnostTextBox].defaultFormatHtml" type="hidden" value="True" /><span  data-valmsg-for="[JinaSpolecnostTextBox]" data-valmsg-replace="true"></span>
    </div>
  </div>
</div>

CodePudding user response:

The issue in your code is because $('[PrimaGroupList]') isn't a valid selector. You need to use the 'attribute selector' to retrieve the element by its name. The code should look like this:

let $textbox = $("#JinaSpolecnost");

$('select[name="[PrimaGroupList]"]').change(function() {
  var selectedValue = $(this).val();
  if (selectedValue == "Jiná společnost:")
    $textbox.show();
  else
    $textbox.hide();
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div>
  <div  id="Bod1">
    <div >
      <label for="DropDownList1">Vyberte z možnost&#237;</label> *
      <select  data-val="true" data-val-required="Vyplňte toto pole." name="[PrimaGroupList]" tabindex="1">
        <option value="FTV Prima, spol. s r. o.">FTV Prima, spol. s r. o.</option>
        <option value="MEDIA CLUB, s.r.o.">MEDIA CLUB, s.r.o.</option>
        <option value="PRIMA GROUP MANAŽERSKÁ, a.s.">PRIMA GROUP MANAŽERSK&#193;, a.s.</option>
        <option value="PRIMA DOMA MEDIA, s.r.o.">PRIMA DOMA MEDIA, s.r.o.</option>
        <option value="CAR PR MEDIA, s.r.o.">CAR PR MEDIA, s.r.o.</option>
        <option value="Prima produkce, s.r.o.">Prima produkce, s.r.o.</option>
        <option value="PLAYzone s.r.o.">PLAYzone s.r.o.</option>
        <option value="PLAYPRESS s.r.o.">PLAYPRESS s.r.o.</option>
        <option value="RADIO UNITED BROADCASTING s.r.o.">RADIO UNITED BROADCASTING s.r.o.</option>
        <option value="Jiná společnost:">Jin&#225; společnost (uveďte)</option>
        <option selected="selected" value=""></option>
      </select>
    </div>
    <div  id="JinaSpolecnost" style="display:none">
      <label for="[JinaSpolecnostTextBox]" class=>N&#225;zev jin&#233; společnosti</label> *
      <input  data-showSuggestionsOnClick="true" data-val="true" data-val-required="Vyplňte toto pole." name="[JinaSpolecnostTextBox]" placeholder="" tabindex="1" type="text" value="" /><input name="[JinaSpolecnostTextBox].IsHtml"
        type="hidden" value="True" /><input name="[JinaSpolecnostTextBox].defaultFormatHtml" type="hidden" value="True" /><span  data-valmsg-for="[JinaSpolecnostTextBox]" data-valmsg-replace="true"></span>
    </div>
  </div>
</div>

  •  Tags:  
  • Related