jQuery collect select menus to post action

Представете си следната ситуация — имате страница с N на брой списъци (select). Имаме функционалност, която на промяна на даден елемент изпраща пост заявка към сървърния скрипт, а трябва да изпратим като асоцииран масив или обект всички текущи избрани елементи.

Разбира се, ако N <= 5 може и въобще да не ни интересува за някакъв по-удобен начин за събиране на данните, но представете си че имате 20+ елемента

Ами…let’s do it:

function submitSelectData() {
    var selects = new Array();
    var values = new Array();

    $("select").each(function() {
        selects.push($(this).attr("name"));
        $(this, "option:selected").each(function() {
            values.push($(this).val());
        });
    });

    $.post("/script.php", {names: selects, vals: values}, function(response) {
        alert(response);
    });
}

$("select").change(function() {
    submitSelectData();
}); 

script.php:

<?php
$data = array();
$data = array_combine($_POST['names'], $_POST['values']);
echo '<pre>' . print_r($data, 1). '</pre>';
exit;
?>

Така винаги имаме точно предадени асоциирани (не забравяйте array_combine()), на всеки key(N) елемент отговаря value(N).