select2 를 사용해서 셀렉트박스를 만들었는데 form submit시 배열로 보내고 싶어요
본문
select2를 사용해서 화면은 만들었습니다.
<select name="sch_g_idx"></select>
$('select[name=sch_g_idx]').select2({
ajax: {
url: 'proc_new.php',
type: "POST",
delay: 250,
data: function (params) {
const query = {
proc_mode: 'get_gym',
search: params.term || '',
type: 'public'
}
console.log(query);
// Query parameters will be ?search=[term]&type=public
return query;
},
processResults: function (result) {
const data = JSON.parse(result).data;
// console.log(result)
// Transforms the top-level key of the response object from 'items' to 'results'
let results = data.map((item) => {
return {
id: item.g_idx
, text: item.g_name
}
});
return {
results: results
};
}
}
});
제가 원하는 데이터를 검색 후 선택할 수 있도록 개발은 되어있고, 다른페이지에서도 잘 사용중입니다
새로 만드는 페이지에서는 sch_g_idx 가 n개 들어갈 상황이여서 2개 생성 후 보내니 배열 형태가 아니여서 마지막선택된 값만 보내지고 있습니다.
<form onsubmit="return form_info_submit(this);">
폼이 보내지기 전 onsubmit에서 값을 찾아서 새로 넣어주려고도 했으나
$("select[name=sch_g_idx]:checked").val()
jqurey문법이 틀렸는지 값이 나오지 않네요
배열로 보내거나, onsubmit에서 값들을 찾아 form내부에 새로 생성하고 싶어요
도와주세요~
답변 2
<select name="sch_g_idx"> 을
<select name="sch_g_idx[]"> 로 해보세요
그렇게 되면 select2가 적용이 안되더라구요
caught Error: Syntax error, unrecognized expression: select[name=sch_g_idx[]]
신택스 에러가 나와요
$('select[name=sch_g_idx[]]').select2({ 이렇게 수정했었어요
$('select[name=sch_g_idx[]]').select2({
=>
$('select[name="sch_g_idx[]"]').select2({
<?php
if (empty($_REQUEST) == false) {
print_r($_REQUEST);
}
?>
<style>
select[name="sch_g_idx[]"] {
width: 50%;
display: block;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(function () {
$('select[name="sch_g_idx[]"]').select2({
ajax: {
url: 'proc_new.php',
type: "POST",
delay: 250,
data: function (params) {
const query = {
proc_mode: 'get_gym',
search: params.term || '',
type: 'public'
}
console.log(query);
// Query parameters will be ?search=[term]&type=public
return query;
},
processResults: function (result) {
const data = JSON.parse(result).data;
// console.log(result)
// Transforms the top-level key of the response object from 'items' to 'results'
let results = data.map((item) => {
return {
id: item.g_idx
, text: item.g_name
}
});
return {
results: results
};
}
}
});
});
function form_info_submit(frm) {
return true;
}
</script>
<form onsubmit="return form_info_submit(this);">
<select name="sch_g_idx[]" multiple="multiple"></select>
<input type="submit" />
</form>
답변을 작성하시기 전에 로그인 해주세요.
