удалить div, если значение параметра не выбрано - PullRequest
Новая
       34

удалить div, если значение параметра не выбрано

0 голосов
/ 25 января 2020

что с этим не так? 

            function admSelectCheck(nameSelect)
            {
                console.log(nameSelect);
                if(nameSelect){
                    admOptionValue = document.getElementById("admOption").value;
                    if(admOptionValue === nameSelect.value){
                        document.getElementById("admDivCheck").style.display = "block";
                    }
                    else{
                        document.getElementById("admDivCheck").style.display = "none";
                    }
                }
                else{
                    document.getElementById("admDivCheck").style.display = "none";
                }
            }

Есть два варианта: один ПОЛЕТ , а другой - РЕГИОН 

<div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Type:</strong>
                {!! Form::select('type', \App\Destination::getEnum('type'),\App\Destination::getEnum('type'), array('onchange' => "admSelectCheck(this);", 'id' => "admOption")) !!}
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group" id="admDivCheck" style="display:none;">
                <strong>Flights:</strong>
                {!! Form::text('flights_data', null, array('class' => 'form-control')) !!}
            </div>
        </div>

когда я выбираю ПОЛЕТ , поле ввода Полеты появляется, но когда я выбираю РЕГИОН поле ввода Полеты все еще появляется. Я хочу, чтобы он исчез после выбора РЕГИОН .

, пожалуйста, помогите.

1 Ответ

2 голосов
/ 25 января 2020

Вам нужно изменить это, потому что оно всегда возвращает true: 

if(admOptionValue === nameSelect.value){

на это: 

if (admOptionValue === "FLIGHT") {

Проблема заключалась в том, что nameSelect.value идентичен document.getElementById("admOption").value потому что переменная nameSelect фактически указывает на тот же элемент, и это делается путем вызова функции javascript со ссылкой this.

Пример: 

function admSelectCheck(nameSelect) {
  if (nameSelect) {
    admOptionValue = document.getElementById("admOption").value;
    if (admOptionValue === "FLIGHT") {
      document.getElementById("admDivCheck").style.display = "block";
    } else {
      document.getElementById("admDivCheck").style.display = "none";
    }
  } else {
    document.getElementById("admDivCheck").style.display = "none";
  }
}
<div class="col-xs-12 col-sm-12 col-md-12">
  <div class="form-group">
    <strong>Type:</strong>
    <select id="admOption" onchange="admSelectCheck(this);">
      <option>REGION</option>
      <option>FLIGHT</option>
    </select>
  </div>
</div>
<div class="col-xs-12 col-sm-12 col-md-12">
  <div class="form-group" id="admDivCheck" style="display:none;">
    <strong>Flights:</strong>
    <input type="text" class="form-control" value="flights data" />
  </div>
</div>

В вашем случае необходимо добавить условие полетов в оператор if, чтобы отобразить обязательное текстовое поле, если была выбрана опция FLIGHTS.

...