Несколько раскрывающихся входов на одной странице функции

Question

Я пытаюсь передать URL с некоторыми параметрами в раскрывающемся списке выбора, я вызываю функцию с onchange событие.

Проблема, с которой я столкнулся, состоит в том, что на одной странице есть несколько выпадающих списков, каждый из которых использует раскрывающийся список. Когда я выбираю опцию, передается только значение первого выбора, даже если выбран любой выбор.

например

<tr><td>
<select onchange="updateStatus();">
    <option value="changed&amp;id=771">Change</option>
    <option value="posted&amp;id=771">Posted</option>
</select>
</td></tr>

<tr><td>
<select onchange="updateStatus();">
    <option value="changed&amp;id=750">Change</option>
    <option value="posted&amp;id=750">Posted</option>
</select>
</td></tr>

И функция Jquery:

function updateStatus() {
$.ajax({
    type: 'GET', 
    url: 'print.php',
    data: {stat: $('select').val()},
    success: function (data) {
        alert('done');
    }
})
}

Я вижу в своей консоли, что данные передаются, но всегда первое значение.

Что мне нужно изменить, чтобы это было соответствующее значение, а не всегда первое? заранее спасибо.

Answer 1

Все, что вам нужно сделать, это передать выбор, который вы изменяете в функции: ваш HTML должен измениться так:

function updateStatus(changedSelect) {
console.log($(changedSelect).val());
$.ajax({
    type: 'GET', 
    url: 'print.php',
    data: {stat: $(changedSelect).val()},
    success: function (data) {
        alert('done');
    }
})
}

<!-- And, your jquery should change like this: -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr><td>
<select onchange="updateStatus(this);">
    <option value="changed&amp;id=771">Change</option>
    <option value="posted&amp;id=771">Posted</option>
</select>
</td></tr>

<tr><td>
<select onchange="updateStatus(this);">
    <option value="changed&amp;id=750">Change</option>
    <option value="posted&amp;id=750">Posted</option>
</select>
</td></tr>

Answer 2

Во-первых, уберите JS из разметки. Это просто хорошая практика:

$('select').change(function() {
    updateStatus();
});

Затем укажите, какой выбор вы хотите передать (тот, который был нажат):

updateStatus($(this)); // pass the jQuery element object

function updateStatus(el) { // and receive it as 'el' (or whatever)
    $.ajax({
        type: 'GET', 
        url: 'print.php',
        data: {stat: el.val()}, // use it here
        success: function (data) {
            alert('done');
        }
    });
}

Answer 3

Я верю что ты хочешь $(this).find(':selected').val(); вместо $('select').val(), это получит выбранную опцию из любого изменяющегося выпадающего меню.