반응형
post할 데이터가 배열에 많이 할당되는 경우가 생겼다.
html에서 name이 배열 형태로 되어있는 데이터를 ajax를 이용해서 서버로 post하는데 많은 데이터를 넘겨야되는 일이 있었다.
몇 십 건까지는 문제없었지만 200건이 넘어가는 순간부터는 배열이 넘어가지 않았다.
아마 서버에서 post받는 양이 제한되는듯 하다. 서버를 건드릴수가 없어서 jquery를 수정해봤다.
기존ajax
$.ajax({
url: '/url',
type: 'post',
dataType: 'json',
data: $('#form').serialize(),
success: function (response) {
alert(response.msg);
if(response.status=='ok'){
self.location.reload();
}
},
error: function (request, status, error) {
console.log("code:" + request.status + "\n" + "message:" + request.responseText + "\n" + "error:" + error);
}
});
serialize를 활용하여 post했더니 200건 이상부터는 배열이 넘어가지 않았다.
그래서 직렬화 후 post하도록 수정했다.
수정ajax
let dataArray = [];
//json 직렬화 후에도 index 끼리의 순서를 맞춰주기 위해 아래처럼 가져옴
$('input[name="f_name[]"]').each(function(index) {
let obj = {
f_name: $(this).val(),
f_phone: $('input[name="f_phone[]"]').eq(index).val(),
f_post_num: $('input[name="f_post_num[]"]').eq(index).val(),
f_nickname: $('input[name="f_nickname[]"]').eq(index).val()
};
dataArray.push(obj);
});
// 동기화 데이터 배열을 JSON 형식으로 직렬화
let syncData = JSON.stringify(dataArray);
//단순 serialize로는 200개 이상의 배열을 post하지못함
//json 형식으로 직력화 후 post
$.ajax({
url: '/url',
type: 'post',
dataType: 'json',
data: {
"csrf":"csrf",
arrayData: syncData,
type: $("#type").val()
},
success: function (response) {
alert(response.msg);
if(response.status=='ok'){
self.location.reload();
}
},
error: function (request, status, error) {
console.log("code:" + request.status + "\n" + "message:" + request.responseText + "\n" + "error:" + error);
}
});
php서버에서 받는 코드
$arr_data = $this->input->post("arrayData");
$data_arr = json_decode($arr_data, true); // JSON 데이터를 배열로 변환
$f_name_arr = array();
$f_phone_arr = array();
$f_post_num_arr = array();
$f_nickname_arr = array();
//json형태로 가져온 배열들 arr에 할당
foreach ($data_arr as $entry) {
array_push($f_name_arr ,$entry['f_name']);
array_push($f_phone_arr ,$entry['f_phone_arr']);
array_push($f_post_num_arr ,$entry['f_post_num_arr']);
array_push($f_nickname_arr ,$entry['f_nickname_arr']);
}
arrayData로 직렬화된 데이터를 받아 decode를 해서 배열로 변환 후
반복문을 돌려 각각에 원하는 배열에 push 해주었다.
더 나은 방법이 있는지는 찾아봐야겠다.
반응형
'자바스크립트(jquery)' 카테고리의 다른 글
javascript 세션 유지 로그인 문제 (0) | 2024.03.23 |
---|---|
javascript undefined, null 체크 (0) | 2024.03.23 |
체크박스 전체선택 및 선택삭제 (0) | 2024.03.22 |
javascript에서 formData append 확인법 (0) | 2024.03.22 |
javascript 로딩 프로그래스바 (0) | 2024.03.22 |