jqueryui 자동 완성 맞춤 데이터, 목록 생성

Question

첫 번째 필드는 두 번째 필드에서 사용 가능한 것을 제한하고 두 번째 필드는 세 번째 필드에서 사용 가능한 것을 제한하는 양식을 작성합니다.

Jqueryui 자동 완성 기능을 사용하려고하는데 문제가 발생했습니다. 나는 다른 많은 소스를 온라인으로 시도했지만 그것을 가져갈 수없는 것 같습니다. 나는 문제를 설명 할 수있는 위젯을 사용자 정의하는 것에 익숙하지 않다.

현재 제대로 (아래에있는) 내 PHP 파일에서 데이터를 게시하고받을 수 있지만 자동 완성은 찾은 정보를 표시하지 않습니다. 데이터가 있습니다. 단순히 팝업 목록으로 가져올 수 없습니다.

생각하십니까?

$tier1=mysql_real_escape_string($_POST['tier1']); 
$tier2=mysql_real_escape_string($_POST['tier2']); 
$tier3=mysql_real_escape_string($_POST['tier3']); 

if($tier1!=''){ 
    $query = mysql_query("SELECT * FROM varIssues WHERE tier1 LIKE '$tier1%'"); 
} 

if($tier2!=''){ 
    $query = mysql_query("SELECT * FROM varIssues WHERE tier1='$tier1' AND tier2 LIKE '$tier2%'"); 
} 

if($tier3!=''){ 
    $query=mysql_query("SELECT * FROM varIssues WHERE tier1 = '$tier1' AND tier2 ='$tier2' AND tier3 LIKE '$tier3%'"); 
} 
    //build array of results 
    for ($x = 0, $numrows = mysql_num_rows($query); $x < $numrows; $x++) { 
     $row = mysql_fetch_assoc($query); 
     $issues[$x] = array('tier1'=>$row["tier1"],'tier2'=>$row['tier2'],'tier3'=>$row['tier3']); 
    } 

    //echo JSON to page 
    $response = $_GET["callback"] . "(" . json_encode($issues) . ")"; 
    echo $response; 

Answer 1

응답 끝에 세미콜론을 사용하면 작동합니까?

$.ajax({ 
    url: "issue_autocomplete.php", 
    type: "POST", 
    dataType: "json", 
    data:$form_data, 
    success: function(data){ 
     response($.map(data, function(item){ 
      return{ 
        label:item.term1, 
        value:item.term2 
       } 
     })); 
    } 
}); 

편집 : 반환 된 데이터가 올바른지에 대한 명세서를 (아마도 결과를 구문 분석 가정하는 또 다른 방법 - 확실히 알고 아래) (경고의 주석

function autocompleteJSONParseCode(data) { 
    var rows = new Array(); 
    var rowData = null; 
    for (var i = 0, dataLength = data.length; i < dataLength; i++) { 
    rowData = data[i]; 
    // alert(rowData.term2+":"+rowData.term1);//uncomment to see data as it parses 
    rows[i] = { 
     value: rowData.term2, 
     label: rowData.term1 
    }; 
    } 

    return rows; 
}; 
$(".tiers input[type='text']").autocomplete({ 
    source: function(request, response) { 
     var $form_data=$('.tiers').parents('form').serialize(); 
     $.ajax({ 
     url: "issue_autocomplete.php", 
     dataType: "json", 
     type: "POST", 
     contentType: "application/json", 
     data:$form_data, 
     success: function(data) { 
      var rows = autocompleteJSONParseCode(data); 
      response(rows); 
     } 
     }); 
    }, 
    minLength: 2 
}); 

Answer 2

나는이 다시

$issues[$x] = array('tier1'=>$row["tier1"],'tier2'=>$row['tier2'],'tier3'=>$row['tier3']); 

보내는 JSON 경우 당신은 이런 식으로 접근해야한다고 생각 (잘 정보를 검색하는)

$(".tiers input[type='text']").autocomplete({ 
    source: function(request, response) 
    {    
    var $form_data=$('.tiers').parents('form').serialize(); 
     $.ajax({ 
       url: "issue_autocomplete.php", 
       type: "POST", 
       dataType: "json", 
       data:$form_data,              
        success: function(data){ 
        response($.map(data, function(item){ 
         return{  
         label:item.tier1, 
         value:item.tier1      
         } 
       })) 
       } 
     }); 

        }, 
        minLength: 2 
       }); 

그리고 PHP

  success: function(data){ 
       response($.map(data, function(item){ 
        return{  
        label:item.tier1, 
        value:item.tier2      
        } 
      })) 
      } 

만약 당신이 설치 한 방화범이 있다면 당신은 console.log 데이터를 반환하고 모든 것이 OK인지를 확인하십시오.

Answer 3

이의 jQuery 플러그인. 에서 당신에게 도움이 될 수 있습니다.

http://www.codeassembly.com/Simple-chained-combobox-plugin-for-jQuery/