데이터베이스에서 여러 개의 드롭 다운 목록을 채우는 jquery

Question

jQuery를 사용하여 데이터베이스의 값으로 단일 드롭 다운 상자를 채우는 방법을 알고 있습니다. 하지만 이제는 드롭 다운을 사용하여 5 개의 테이블 필드를 걸러 내기 위해 긴 쿼리를 작성해야합니다. 두 번째 드롭 다운을 변경하여 나머지 3 개의 드롭 다운을 변경해야합니다. 단일 드롭 다운을 변경하기 위해 Ajax를 사용하여 URL로 보낸 다음 html을 반환하고 select 필드에 배치했습니다.

jQuery.ajax({ 
     type: "POST", 
     url: "getdb/tb", 
     data: '{data : "data" }', 
     success: function (data) { 
      jQuery("select#field_1").html(returnval); 
     }, 
     failure: function (response) { 
      alert("failed"); 
     } 
}); 

내 URL "getdb/tb"에서는 SELECT 문을 사용하여 쿼리를 필터링하고 옵션 필드를 표시합니다.
하지만 첫 번째 드롭 다운에서 수행 된 단일 변경 기능을 사용하여 여러 다른 HTML 옵션 필드를 다른 4 개의 드롭 다운으로 보내는 방법을 모른다. 제발 초보자를 도와주세요. 미리 감사드립니다.

UPDATE : 이

jQuery.ajax({ 
     - 
     - 
     success: function(data){ 
     callfirst(); 
     } 
}); 

function callfirst(){ 
    jQuery.ajax({ 
     - 
     - 
     success: function(data){ 
      callsecond(); 
     } 
    }); 
} 

function callsecond(){ 
    jQuery.ajax({ 
      - 
      - 
      success: function(data){ 
       callthird(); 
      } 
} 

Answer 1

귀하의 방법를 미세처럼 할 수있는 좋은 방법이 그것이지만 많은 아약스 모든 선택 필드에 옵션 값을 가지고 호출해야합니다. JSON을 사용하여 단일 아약스 호출에서이를 수행 할 수 있습니다. PHP 페이지에서 네 개의 선택 상자에 대한 옵션을 나타내는 HTML 문자열을 포함하는 배열을 만들 수 있습니다. 그런 다음로 json_encode() 함수를 사용하여 JSON 문자열이 배열을 변환 할 수 있습니다

function loadOptions(){ 
jQuery.ajax({ 

    success: function(data){ 
    jQuery("select#field_2").html(data["second"]); 
    jQuery("select#field_3").html(data["third"]); 
    jQuery("select#field_4").html(data["fourth"]); 
    jQuery("select#field_5").html(data["fifth"]); 
    } 
}); 
} 

: 웹 페이지에 다음

$arr=array("second"=>"<option>....</option>.......<option...</option>", //for second dropdown 
      "third"=>"<option>....</option>.......<option...</option>", //for third dropdown 
      "fourth"=>"<option>....</option>.......<option...</option>", //for fourth dropdown 
      "fifth"=>"<option>....</option>.......<option...</option>" //for fifth dropdown 
); 
echo json_encode($arr); 

를 첫 번째 드롭 다운을 위해, 당신은이 같은 jQuery를 기능을 쓸 수 있습니다 이 방법으로 하나의 아약스 호출에서 다른 모든 드롭 다운 옵션을로드 할 수 있습니다. 다른 드롭 다운에서도 비슷한 기능이 필요하다는 것을 알고 있습니다. 다른 드롭 다운에도 비슷한 기능을 쓸 수 있습니다. 다음은 일반화 된 함수입니다.이 함수에서 드롭 다운 번호를 전달하면 함수가 대상 드롭 다운 옵션을 반환합니다. 예를 들어, 드롭 다운 번호 2를 전달하면 함수는 드롭 다운 3, 4 및 5에 대한 옵션을 반환합니다. 3을 전달하면 드롭 다운 4 및 5에 대한 옵션 등이 반환됩니다.

는 PHP 페이지에서

function loadOptions(selectNo){ 
jQuery.ajax({ 
    data:{"selectNo",selectNo}, 
    success: function(data){ 
    switch(selectNo){ 
    case 1: jQuery("select#field_2").html(data["second"]); 
    case 2: jQuery("select#field_3").html(data["third"]); 
    case 3: jQuery("select#field_4").html(data["fourth"]); 
    case 4: jQuery("select#field_5").html(data["fifth"]); 
    } 
    } 
}); 
} 

,이 기능을 구현하기 위해 아래의 코드를 작성할 수 있습니다 : JSON에 대한

$selectNo=$_GET["selectNo"]; 
$arr=array(); 
switch(selectNo){ 
case 1: $arr["second"]="<option>....</option>.......<option...</option>"; //for second dropdown 
case 2: $arr["third"]="<option>....</option>.......<option...</option>"; //for third dropdown 
case 3: $arr["fourth"]="<option>....</option>.......<option...</option>"; //for fourth dropdown 
case 4: $arr["fifth"="<option>....</option>.......<option...</option>"; //for fifth dropdown 
} 
echo json_encode($arr); 

상세 정보 here를 찾을 수 있습니다.