Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как сделать, что бы в переменную не записывались пустые значения? (https://javascript.ru/forum/dom-window/78436-kak-sdelat-chto-v-peremennuyu-ne-zapisyvalis-pustye-znacheniya.html)

DivMan 14.09.2019 12:18

Как сделать, что бы в переменную не записывались пустые значения?
 
Есть несколько блоков, которые перебираются циклом. В них содержатся инпуты и label, при нажатии на input, в консоль попадает input поле и label для него, в label нету атрибута value, а в input есть и в переменную я записываю значение атрибута value для input, но так как его нету в label, то в переменную попадает пустое значение.

И я решил сделать условие, что бы не попадало пустое значение, можно ли как то этот код улучшить?

<div class="options">
        <input type="hidden" value="18" class="questionId" name="questionId">
          <input type="radio" name="r-1" id="radio-1" value="1" title=""/>
          <label for="radio-1" class="false-answer">Да</label>
          <input type="radio" name="r-1" id="radio-2" value="2" title=""/>
          <label for="radio-2" class="true-answer">Нет</label>
        </div>

<div class="options">
            <input type="hidden" value="17" class="questionId" name="questionId">
          <input type="radio" name="r-2" id="radio-3" value="1" title=""/>
          <label for="radio-3" class="false-answer">Да</label>
          <input type="radio" name="r-2" id="radio-4" value="2" title=""/>
          <label for="radio-4" class="true-answer">Нет</label>
          <input type="radio" name="r-2" id="radio-5" value="3" title=""/>
          <label for="radio-5" class="false-answer">Движение разрешено только по обочине.</label>
        </div>

<div class="options">
        <input type="hidden" value="16" class="questionId" name="questionId">
          <input type="radio" name="r-3" id="radio-6" value="1" title=""/>
          <label for="radio-6" class="false-answer">Да</label>
          <input type="radio" name="r-3" id="radio-7" value="2" title=""/>
          <label for="radio-7" class="true-answer">Нет</label>
        </div>


var ans = document.querySelectorAll('.options');
    
    ans.forEach(function (element, i) {

        ans[i].addEventListener('click', function (e) {
         var inputs = e.target.closest('.options');
         var idQuestion = inputs.getElementsByClassName("questionId")[0].value;
            
        var answer = '';
           
           if(e.target.hasAttribute('value')) {
             answer = e.target.value;
           }

            else {
                return; // что бы не попадало пустое значение
            }

        console.log(answer);
        
 })

    })

laimas 14.09.2019 13:48

И зачем такие сложности.

var ans = document.querySelectorAll('.options');
     
ans.forEach(function (element) {
    element.addEventListener('change', function (e) {
        console.log(e.target) //это та радио кнопка, которую выбрали и значение которой является значением группы
         
    }) 
})

рони 14.09.2019 13:51

DivMan,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<div class="options">
        <input type="hidden" value="18" class="questionId" name="questionId">
          <input type="radio" name="r-1" id="radio-1" value="1" title=""/>
          <label for="radio-1" class="false-answer">Да</label>
          <input type="radio" name="r-1" id="radio-2" value="2" title=""/>
          <label for="radio-2" class="true-answer">Нет</label>
        </div>

<div class="options">
            <input type="hidden" value="17" class="questionId" name="questionId">
          <input type="radio" name="r-2" id="radio-3" value="1" title=""/>
          <label for="radio-3" class="false-answer">Да</label>
          <input type="radio" name="r-2" id="radio-4" value="2" title=""/>
          <label for="radio-4" class="true-answer">Нет</label>
          <input type="radio" name="r-2" id="radio-5" value="3" title=""/>
          <label for="radio-5" class="false-answer">Движение разрешено только по обочине.</label>
        </div>

<div class="options">
        <input type="hidden" value="16" class="questionId" name="questionId">
          <input type="radio" name="r-3" id="radio-6" value="1" title=""/>
          <label for="radio-6" class="false-answer">Да</label>
          <input type="radio" name="r-3" id="radio-7" value="2" title=""/>
          <label for="radio-7" class="true-answer">Нет</label>
        </div>
  <script>
    var ans = document.querySelectorAll('.options');
    ans.forEach(function (element, i) {
        var idQuestion = element.querySelector(".questionId").value;
        element.addEventListener('change', function (e) {
        var answer = e.target.value;
        console.log(idQuestion, answer)
         })
    })
  </script>
</body>
</html>

рони 14.09.2019 13:56

Цитата:

Сообщение от laimas
'change'

код выше исправил :thanks:

laimas 14.09.2019 14:09

рони,
а зачем так element.querySelector(".questionId").value;, если достаточно e.target.value;?

DivMan 14.09.2019 15:00

Спасибо

DivMan 14.09.2019 15:02

Цитата:

Сообщение от laimas (Сообщение 512743)
рони,
а зачем так element.querySelector(".questionId").value;, если достаточно e.target.value;?

Это для скрытого поля

laimas 14.09.2019 15:28

Цитата:

Сообщение от DivMan
Это для скрытого поля

А зачем еще и скрытые поля?

DivMan 14.09.2019 15:47

Цитата:

Сообщение от laimas (Сообщение 512749)
А зачем еще и скрытые поля?

Что бы для AJAX передать id поста

laimas 14.09.2019 15:51

Цитата:

Сообщение от DivMan
Что бы для AJAX передать id поста

У вас что вне формы это все?


Часовой пояс GMT +3, время: 19:42.