두 가지 선택 요소 A와 B가 있습니다. A가 선택한 옵션이 변경되면 B의 옵션도 그에 따라 업데이트되어야합니다. A의 각 요소는 B의 많은 요소를 의미하며 일대 다 관계입니다 (A는 국가를 포함하고 B는 주어진 국가에 위치한 도시를 포함해야 함).
함수 do_ajax
는 비동기 요청을 실행해야합니다.
function do_ajax(elem, mydata, filename)
{
$.ajax({
url: filename,
context: elem,
data: mydata,
datatype: "html",
success: function (data, textStatus, xhr) {
elem.innerHTML = data;
}
});
}
B의 옵션을 업데이트하기 위해 A의 onChange
이벤트 에 함수 호출을 추가했습니다 . 다음은 onChange 이벤트 (of A
)가 트리거 될 때 실행되는 함수입니다 .
function my_onchange(e) // "e" is element "A"
{
var sel_B = ... ; // get select element "B"
// I skipped some code here
// ...
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
do_ajax(city_sel, data, 'ajax_handler.php');
}
}
배열 (키 값 쌍)이 될 수있는 JQuery 문서 를 읽었습니다 data
. 다음과 같이 넣으면 오류가 발생합니다.
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
대신 데이터가 문자열이면 해당 오류가 발생하지 않습니다.
var data = 'mode=filter_city&id_A=' + e[e.selectedIndex];
하지만 서버 측 PHP 코드에서 변수의 “배열 버전”이 필요합니다.
은 Uncaught TypeError: Illegal invocation
내가 코드의 일부 오류를 제기 무엇인지 알아낼 수 있도록, 모두가 압축되어있는 “JQuery와-1.7.2.min.js”파일에 있습니다.
데이터를 연관 배열로 받아들이도록 코드에서 변경할 수있는 설정이 있습니까?
답변
Sarfraz 와의 대화 덕분에 우리는 해결책을 찾을 수있었습니다.
문제는 그 값 대신 HTML 요소를 전달하고 있다는 것이 었습니다. 이것은 실제로 제가 원했던 것입니다 (사실 제 PHP 코드에서는이 값을 cities
테이블 을 쿼리 하고 올바른 항목을 필터링 하기위한 외래 키로 필요 합니다).
따라서 대신 :
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
그것은해야한다:
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex].value
};
참고 : Jason Kulatunga의 답변을 확인 하십시오. HTML 요소를 전달하는 것이 문제를 일으키는 이유를 설명하기 위해 JQuery 문서를 인용합니다.
답변
에 대한 jQuery 문서에서 processData
:
processData 부울
기본값 : true
기본적으로 데이터 옵션에 개체 (기술적으로 문자열 이외의 모든 항목)로 전달 된 데이터는 처리되어 기본 콘텐츠 유형 “application / x-www”에 맞는 쿼리 문자열로 변환됩니다. -form-urlencoded “. DOMDocument 또는 기타 처리되지 않은 데이터를 보내려면이 옵션을 false로 설정하십시오.
출처 : http://api.jquery.com/jquery.ajax
processData
데이터를 서버로 보내거나 쿼리 문자열 인코딩 매개 변수를 지원하도록 PHP 스크립트를 수정하는 데 사용해야 할 것 같습니다 .
답변
ajax 호출을 올바르게 설정하지 않았기 때문에 FormData 객체를 게시하는 동안이 오류가 발생했습니다. 아래 설정으로 문제가 해결되었습니다.
var myformData = new FormData();
myformData.append('leadid', $("#leadid").val());
myformData.append('date', $(this).val());
myformData.append('time', $(e.target).prev().val());
$.ajax({
method: 'post',
processData: false,
contentType: false,
cache: false,
data: myformData,
enctype: 'multipart/form-data',
url: 'include/ajax.php',
success: function (response) {
$("#subform").html(response).delay(4000).hide(1);
}
});
답변
데이터가 배열 (키 값 쌍)이 될 수 있다는 JQuery 문서를 읽었습니다. 다음과 같이 넣으면 오류가 발생합니다.
이것은 배열이 아닌 객체입니다.
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
아마도 다음을 원할 것입니다.
var data = [{
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
}];
답변
최근에 같은 문제가 있었으며 다음을 추가하여 해결했습니다. traditional: true,
답변
function do_ajax(elem, mydata, filename)
{
$.ajax({
url: filename,
context: elem,
data: mydata,
**contentType: false,
processData: false**
datatype: "html",
success: function (data, textStatus, xhr) {
elem.innerHTML = data;
}
});
}
답변
$.ajax({
url:"",
type: "POST",
data: new FormData($('#uploadDatabaseForm')[0]),
contentType:false,
cache: false,
processData:false,
success:function (msg) {}
});