Question

我有这个jQuery代码，用“添加”按钮在表格行中添加<select>元素：

$("#add").click(function() {
    $('#selected > tbody:last').append('<tr><td><select id=\'plan_id\'><option value=\'1\'>One</option><option value=\'2\'>Two</option><option value=\'3\'>Three</option></select></td></tr>');
    });

我需要在下面的代码中修改什么才能将select元素中的多个值作为数组发布？现在它只在我的MySQL数据库中插入一个值。

$('#course_update').click(function() {

var course_id = $('#course_id').val();
var plan_id = $('#plan_id').val();
var price_id = $('#price_id').val();
var course_name = $('#course_name').val();
var course_isActive = $('#course_isActive').val();
var course_city_id = $('#course_city_id').val();


$('#update_status').html('<img src="../images/ajax-loader.gif" />');
$.post('../update.php', {

    course_id: course_id, 
    plan_id : plan_id,
    price_id: price_id,
    course_name: course_name,
    course_city_id: course_city_id,
    course_isActive: course_isActive

    }, function(data) {
    $('#update_status').html(data);
    return false;
 });
});

Answer 1

我会给每个select元素一个唯一的名称，一个数组在这里也会很好用，请看这个例子：

$('#selected > tbody:last').append('<tr><td><select id=\'plan_id\' name="my_select[]"><option value=\'1\'>One</option><option value=\'2\'>Two</option><option value=\'3\'>Three</option></select></td></tr>');

，然后在发送之前序列化表单：

var my_data = $("form").serialize();
...

修改：完整示例：

$("#add").click(function() {
    $('#selected > tbody:last').append('<tr><td><select id=\'plan_id\' name="my_select[]"><option value=\'1\'>One</option><option value=\'2\'>Two</option><option value=\'3\'>Three</option></select></td></tr>');
    });
                                                                      ^^^^^^^^^^^^^^^^^^^

和

$('#course_update').click(function() {

var my_data = $("form").serialize();

$('#update_status').html('<img src="../images/ajax-loader.gif" />');
$.post('../update.php', my_data, function(data) {
    $('#update_status').html(data);
    return false;
 });
});

Answer 2

首先，您必须使用选择的类而不是id。当你使用id时，jQuery只返回一个元素。之后，以下函数会将您作为参数给出的选择的所有值转换为数组。

/**
 * Convert select to array with values
 */    
function serealizeSelects (select)
{
    var array = [];
    select.each(function(){ array.push($(this).val()) });
    return array;
}

所以：

var course_ids = serealizeSelects($('.course_id'));

例如应该返回：

[1,3,2]

使用jQuery POST发送多个<select>元素</select>

2 个答案: