iT邦幫忙

0

使用ajax取得多選資料

  • 分享至 

  • xImage

前端目前的設計如下

<form method="post" id="insert_form">
<label>text1</label>
<input type="text" name="text1" id="text1" class="form-control"/>

<label>text2</label>
<input type="text" name="text2" id="text2" class="text2" />

<label>select_multiple</label>
<select class="selectpicker" multiple data-actions-box="true" name="select_multiple" id="select_multiple" >
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</form>
$('#insert_form').on("submit", function(event){
event.preventDefault();
$.ajax({
url:"/insert",
method:"POST",
data:$('#insert_form').serialize(),
success:function(data){
$('#add_data_Modal').modal('hide');
if (data=='success') {
window.location.href = "/Home";
}
}
});
}
);

目前是使用.serialize()取得表格資料,不過多選資料只會取得一個,請教各位大神如何解決此問題!感謝!!

archer9080 iT邦研究生 3 級 ‧ 2022-06-13 14:17:11 檢舉
name="select_multiple" ----> name="select_multiple[]"
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 個回答

1
rainbowrain
iT邦新手 2 級 ‧ 2022-06-15 11:13:39
最佳解答

你這是後端的問題,不是前端也不是AJAX的問題。

$('#insert_form').serialize()
=> text1=text1-value&text2=text2-value&select_multiple=1&select_multiple=3

serialize() 回傳的字串有包含多選項目的。


你後端如果是用 php, 那用 archer9080 的回答就可以

又例如後端是 nodejs express, 直接就會幫你把同 param 的值轉成陣列

問題是在你後端接到請求後怎麼處理

感謝提醒~的確是後端的問題,改變後端處理方式就可以了!

0
海綿寶寶
iT邦大神 1 級 ‧ 2022-06-13 17:44:54

沒有更好的答案出現之前
Google這篇供參考

我要發表回答

立即登入回答