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 19:42

Цитата:

Сообщение от laimas (Сообщение 512751)
У вас что вне формы это все?

<div class="box-question">
      <div class="box-title-question">
        <p>Вопрос <strong><span>16</span>/<span>18</span></strong></p>
        <input type="checkbox" title="" id="check-info-3"/>
        <label for="check-info-3" class="icon-info">
          <img src="img/icons/icon-17.png" alt="icon" title=""/>
        </label>
        <div class="box-info">
          <span class="address">Красная пл., Москва, Росія </span>
          <span class="data">10.07.19</span>
          <span class="name">Дмитрий</span>
          <span class="view">266</span>
        </div>
      </div>
      <div class="question-img">
        <img src="img/photo/img-3.jpg" alt="" title=""/>
      </div>
      <div class="question">
        <div class="text-question">
          <p>Должны ли вы уступить дорогу, попутным автомобилям, двигаясь слева от вас уступить дорогу, попутным
            автомобилям, двигаясь слева от вас??</p>
          <span class="true"></span>
        </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>
        <div class="additionally">
          <a href="#">Показать ответ</a>
          <div>
            <button type="button">Добавить в закладки</button>
            <a href="#">1 комментарий</a>
          </div>
        </div>
      </div>
    </div>

laimas 14.09.2019 20:48

Если бы в вашем сценарии событие изменения в группе кнопок порождало запрос к серверу тогда еще можно было бы понять к чему это. Но этого не видно и если запрос, это не связанное событие с изменениями в группах, то почему не отослать форму, которой у вас почему-то нет?

Если весь этот сыр бор ради того чтобы связать каждую группу кнопок с ID, то лучше поступать не так, и связывать группы с ID нужно по ключу. То есть, именовать поля например так (лишнее убрано и для упрощения связь меток с полями через вложение):

<div class="options">
    <label class="false-answer"><input type="radio" name="question[18]" value="1"/> Да</label>
    <label class="false-answer"><input type="radio" name="question[18]" value="2"/> Нет</label>
</div>
 
<div class="options">
    <label class="false-answer"><input type="radio" name="question[17]" value="1"/> Да</label>
    <label class="false-answer"><input type="radio" name="question[17]" value="2"/> Нет</label>
    <label class="false-answer"><input type="radio" name="question[17]" value="3"/> Движение разрешено только по обочине.</label>
</div>
 
<div class="options">
    <label class="false-answer"><input type="radio" name="question[16]" value="1"/> Да</label>
    <label class="false-answer"><input type="radio" name="question[16]" value="2"/> Нет</label>
</div>


Никаких обработчиков выбора в группах конечно же при этом не нужно, а отправив форму сервер получит массив, в случае РНР это будет $_POST/$_GET, к примеру при таком выборе в группах:

Array
(
    [question] => Array
        (
            [18] => 1
            [17] => 3
            [16] => 2
        )

)


То есть ключ question содержит ключи выбранных групп (ID) и выбранное значение в группе.

DivMan 14.09.2019 21:51

var ans = document.querySelectorAll('.options');
    
    var otvet = document.querySelectorAll(".otvet");

    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);
           
            $.ajax({
                headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                type: 'get',
                url: '/check-answer/' + idQuestion,
                dataType: 'json',
                data: {answer: answer},
                success: function (result) {

                    if (result == 1) {
                        if(otvet[i].classList.contains('false')) {
                            otvet[i].classList.remove('false');
                        }
                        otvet[i].classList.add('true');
                        
                    } else if (result == 2) {
                        if(otvet[i].classList.contains('true')) {
                            otvet[i].classList.remove('true');
                            }
                             otvet[i].classList.add('false');
                    }
                    console.log(result);

                },

                error: function () {
                    otvet[i].innerHTML = 'Ошибка сайта';

                }

            });
            

        })

    })

laimas 14.09.2019 22:16

Понятно, по изменению.
А e.target.hasAttribute('value') для чего, огрехи html?

DivMan 15.09.2019 20:33

Цитата:

Сообщение от laimas (Сообщение 512758)
Понятно, по изменению.
А e.target.hasAttribute('value') для чего, огрехи html?

Для того, что бы value не искался у label

laimas 15.09.2019 20:56

Цитата:

Сообщение от DivMan
Для того, что бы value не искался у label

Label устанавливает связь между меткой и элементом формы, и она позволяет изменять значения элементов формы при нажатии курсором мыши на метку. То есть, щелкая хоть по метке, хоть по кнопке, в любом случае произойдет событие в самой кнопке. В индивидуальном обработчике кнопки/флажка вполне будет работать и click, а вот при делегировании это событие не подходит для кнопок и флажков, хотя можно и проверять источник, но корректней все таки не атрибут value, поля могут и не содержать этот атрибут, но при этом это не будет проблемой. При делегировании для кнопок и флажков нужно обрабатывать событие change, а источником его всегда будет только поле, а не метка и т.п..


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