javascript - 将多个选择发送到服务器

Question

我正在使用具有多个选择的表单(使用 Select2)并使用 HTML5 的 Formdata 对象将数据提交到服务器。当我发送文本或文件时它运行良好，但在这种情况下不起作用。

我已根据需要将 name 属性指定为 lbl[]，并且还指定了 multiple="multiple"。

Formdata 是否支持多项选择，或者我缺少什么吗？

我的选择:

<select class="form-control theread_p_ip" name="thread_p[]" multiple="multiple" style="width: 100%"></select>

我使用 Formdata 的方式:

 form_data = new FormData($(mydata.sform)[0]);
 ajaxoptions.data=form_data;

其中 ajaxoptions 是我传递给 JQuery AJAX 的对象，$(mydata.sform)[0] 选择我的表单

我已经使用print_r($_POST,true)进行了检查，我得到了这个:

Array
(
[thread_p] => 
[thread_lbl] => giggg
[ddemand] => json
[dtype] => json
[eltarget] => -1
[sform] => #ta-tbxnewthread
[mkey] => tbx_newthread
)

可以看到thread_p为空。如果我指定 name="thread_p"而不是使用 []，我将单独获得最后选定的值。

PS:忽略数组中的其他值。这些是我从客户端发送的其他参数。

如果您想知道 select 中没有选项，它们是由 select2 通过 AJAX 加载的，该选项工作正常。

更新:使用黑客的 fiddle 解决了:https://jsfiddle.net/95khdzp2/1/

在服务器端，您会得到由“,”分隔的值，如果您使用的是 PHP，则必须使用 explode(',', $variable); 分隔这些值

Answer 1

你可以遵循这个逻辑:

var ajaxOptions = {};
ajaxOptions.data = {};
$(function(){
  $(".theread_p_ip").select2();

  $(".theread_p_ip").change(function(){
    ajaxOptions.data.mySelect2 = $(this).val();
    console.log(ajaxOptions);
  });
});

这样，您的 ajaxOptions Object 就可以根据 select2 的更改来更新他的值。