Вывод выбранных данных из select посредством ajax

281

31 января 2018, 15:53

Есть два объекта на странице. слева select, справа поле в котором я бы хотел видеть вывод выбранных option.

Вся сложность в том чтобы форма справа заполнялась без перезагрузки. Т.е. пользователь сидит щелкает option и справа в форме эти option сразу отображаются.

это форма

    <form action="admissionUser" method="POST" class="form1">
        <select multiple="multiple" id="admissionUser"
                        name="admission[]" id="select1" class="select">
                            <option disabled>Выберите</option>
                            <option value="Показатель 1">1</option>
                            <option value="Показатель 2">2</option>
                            <option value="Показатель 3">3</option>
                            <option value="Показатель 4">4</option>
                    </select>
   </form>

Answer 1

Как-то так. Предотвращает перезагрузку страницы e.preventDefault(). Ну суть думаю ясна.

$('#form').submit(function(e) { 
  e.preventDefault(); 
  var formData = new FormData($('#form')[0]); 
  $('#form select option').each(function() { 
    formData.append("admission", $(this).val()); 
  }); 
  $.ajax({ 
    type: $(this).attr('method'), 
    url: $(this).attr('action'), 
    data: formData, 
    contentType: false, 
    processData: false, 
    success: function(result) { 
      //с сервера приходят данные в result и ты их отображаешь на экран 
      // к примеру создаёшь рядом <div id ='result'></div> 
      $("#result").html("<p>" + result + "</p>"); 
    } 
  }); 
});

Answer 2

Если id тега в который нужно выводить результат - 'output', то

document.getElementById('admissionUser').addEventListener('change', e => 
   document.getElementById('output').innerHTML = e.target.value;
)

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Express - запуск сервера независимо от сессии

Каким образом можно запустить проект на nodejs (использую express

301

javascript

Как добавить кнопку на панель браузера через JavaScript?

Как при помощи JavaScript добавить кнопку на панель браузера, по нажатию на которую будет выполнять JavaScript код на любом открытом в данный момент...

228

javascript