выберите элемент $ (this) .find () не работает - PullRequest
0 голосов
/ 28 ноября 2018

Я пытаюсь получить выбранные значения параметров из элемента select.

<form method="post" action="training/save" enctype="multipart/form-data" id="trainingForm">
  <select name="trainees[]" id="trainees" class="form-control" required multiple="multiple">
    <option value="1">1</option>                    
  </select>
  <button type="submit">Submit</button>
</form>

Я получаю undefined при попытке доступа к значениям select:

$('#trainingForm').submit( function (){
  console.log($(this).find('select[name="trainees"]').val());
});

Я могу получить значения другим способом (по идентификатору):

$('#trainees').val();

ПРИМЕЧАНИЕ: select2 используется.

Но я хочу получить значения прежним способом.

Ответы [ 2 ]

0 голосов
/ 28 ноября 2018

Просто измените

$('#trainingForm').submit( function ()
{
  console.log($(this).find('select[name="trainees"]').val());
});

на

$('#trainingForm').submit( function ()
{
  console.log($(this).find('select[name="trainees[]"]').val());
});

Вам нужно дать то же имя, что и в вашем html.

0 голосов
/ 28 ноября 2018

[] также является частью атрибута name элемента.Вы должны включить это в селектор:

$(document).ready(function() {
    $('#trainees').select2();
});

$('#trainingForm').submit( function (){
  console.log($(this).find('select[name="trainees[]"]').val());
  return false;
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

<form method="post" action="training/save" enctype="multipart/form-data" id="trainingForm">
    <select name="trainees[]" id="trainees" class="form-control" required multiple="multiple">
        <option value="1">1</option> 
        <option value="2">2</option>
    </select>
<button type="submit">Submit</button>
</form>
...