Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 14.09.2019, 19:42
Профессор
Отправить личное сообщение для DivMan Посмотреть профиль Найти все сообщения от DivMan
 
Регистрация: 08.03.2016
Сообщений: 425

Сообщение от laimas Посмотреть сообщение
У вас что вне формы это все?
<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>
Ответить с цитированием
  #12 (permalink)  
Старый 14.09.2019, 20:48
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 10,947

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

Если весь этот сыр бор ради того чтобы связать каждую группу кнопок с 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) и выбранное значение в группе.
Ответить с цитированием
  #13 (permalink)  
Старый 14.09.2019, 21:51
Профессор
Отправить личное сообщение для DivMan Посмотреть профиль Найти все сообщения от DivMan
 
Регистрация: 08.03.2016
Сообщений: 425

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 = 'Ошибка сайта';

                }

            });
            

        })

    })
Ответить с цитированием
  #14 (permalink)  
Старый 14.09.2019, 22:16
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 10,947

Понятно, по изменению.
А e.target.hasAttribute('value') для чего, огрехи html?
Ответить с цитированием
  #15 (permalink)  
Старый 15.09.2019, 20:33
Профессор
Отправить личное сообщение для DivMan Посмотреть профиль Найти все сообщения от DivMan
 
Регистрация: 08.03.2016
Сообщений: 425

Сообщение от laimas Посмотреть сообщение
Понятно, по изменению.
А e.target.hasAttribute('value') для чего, огрехи html?
Для того, что бы value не искался у label
Ответить с цитированием
  #16 (permalink)  
Старый 15.09.2019, 20:56
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 10,947

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

Последний раз редактировалось laimas, 15.09.2019 в 21:01.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как я хотел стать программистом (история из моей жизни) prostofrontend Оффтопик 5 10.01.2017 23:55
Как сделать переменную не изменяемой? 9xakep Общие вопросы Javascript 6 24.04.2012 19:59
Как сделать что бы пока курсор находится на блоке что-либо происходило? Cron532 Общие вопросы Javascript 2 17.03.2012 10:03
Как сделать локальную переменную глобальной?? Дмитрий Общие вопросы Javascript 8 02.11.2010 02:33
Как сделать так что бы ссылки мигали разными цветами? woo_hoo Общие вопросы Javascript 2 19.03.2010 10:28