1

Bootstrap 3.3.6, JQuery 1.11.0, Bootstrap3-typeahead 4.0.2 및 bootstrap-tagsinput 0.8.0을 사용하고 있습니다. 여기 원격 MySQL 소스에서 작동하도록 tagsinput-typeahead를 얻을 수 없습니다.

내 코드입니다 :

$(function() { 
     $('.tagsinput-typeahead').tagsinput({ 
      confirmKeys: [13], 
      itemValue: 'value', 
      itemText: 'text', 
      typeahead: { 
       displayKey: 'text', 
       afterSelect: function(val) { this.$element.val(""); }, 
       source: function (query) { 
        return jQuery.get("typeaheadSource.php?q=" + query); 
       // return jQuery.post("typeaheadSource.php?q=" + query); // I tried both get and post 
        } 
      } 
    }); 
}); 

<div class="form-group"> 
    <label class="control-label col-md-3">Job Number(s) </label> 
    <div class="col-md-8"> 
      <select multiple="multiple" class="form-control tagsinput-typeahead" name="typeahead" id="typeahead" ></select> 
    </div> 
</div> 

그리고 여기 내 typeaheadSource.php입니다 :

if (isset($_REQUEST['q'])) {  
    $query = $_REQUEST['q']; 
    $sql = "SELECT jobno, jobname FROM jobs WHERE jobno LIKE '%" . $query . "%' ORDER BY jobno DESC LIMIT 20"; 
    $result=db_query($sql); 
    while($row = db_nextrow($result)) { 
     $array[] = array('value' => $row['jobno'], 'text' => $row['jobname']); 
    } 
    if (isset($array)) { 
     echo json_encode($array); 
    } 
} 

출력 내가 typeaheadSource.php 직접 다음과 같습니다 실행하는 경우 :

[{"value":"2012006.00","text":"Monterey Hotel Investigation"},{"value":"2006142.00","text":"Ollendorff Residence"},{"value":"2006141.01","text":"MLK Student Union Peer Review Expanded Scope"},{"value":"2006141.00","text":"MLK Student Union Peer Review"}] 

그리고 내가 그 출력을 & 소스 코드로 넣으면, 모든 것이 잘 작동합니다.

Screen shot

$('.tagsinput-typeahead').tagsinput({ 
     confirmKeys: [13], 
     itemValue: 'value', 
     itemText: 'text', 
     typeahead: { 
      displayKey: 'text', 
      afterSelect: function(val) { this.$element.val(""); }, 
      source: [{"value":"2012006.00","text":"Monterey Hotel Investigation"},{"value":"2006142.00","text":"Ollendorff Residence"},{"value":"2006141.01","text":"MLK Student Union Peer Review Expanded Scope"}] 
     } 
}); 
하지만 내 소스 내 원격 URL을 호출하면, 선행 입력 내가 오류를 얻을하지 않습니다 &을 표시하지 않습니다.

source: function (query) { 
    return jQuery.get("typeaheadSource.php?q=" + query); 
} 

사람이이 MySQL의 DB를 쿼리 원격 URL에서 작동하도록하는 방법에 대한 어떤 제안이나 조언이 있습니까?

답변

0

사용 JQuery와 자동 완성 JQuery와 자동 완성 tagsinput이 클래스 부트 스트랩 - tagsinput을 생성 바인딩 1 activete의 tagsinput <input type="text" value="" data-role="tagsinput" /> 을 다음과 같이. 추가 모든 referance에 파일 JQuery와, 자동 완성을위한 JQuery와 custom.js, 자동 완성 CSS,

- 여기 2- 필요한 코드

$(".bootstrap-tagsinput > input").autocomplete({ 

         source: function (request, response) { 
          $.ajax({ 
           type: "POST", 
           contentType: "application/json; charset=utf-8", 
           url: url, 
           data: data, 
           dataType: "json", 
           success: function (data) { 
            response(data.d); 
           }, 
           error: function (result) { 

           } 
          }); 
         } 
        }); 

입니다