從sqlite獲取數據並將其顯示在自動完成

Question

我正在使用phonegap爲iPhone應用程序工作。在應用程序中，有幾個下拉列表的值大於10000.現在我們試圖用自動完成代替下拉列表。

我們在SQLite數據庫中維護這些10000條記錄，並在用戶輸入字符串時從數據庫中提取記錄。

CODE：

<input type ="text" class="inputFormText" ng-model="Location.location" id="location" list ="locValues" placeholder="{{'lSummary_Location_text'|translate}}" autocomplete = "on" maxlength="80" ng-keyup="populateLocations($event)"/> 

      <div class="aListCon"> 
       <datalist id="locValues"> 

       </datalist> 
      </div> 

$scope.populateLocations = function($event){ 

       if ($event.target.value.length > 2) { 
        try 
        { 
          db.transaction(function(tx){ 
           tx.executeSql("SELECT ID, VALUE FROM tbl_Location WHERE VALUE LIKE '%" + $event.target.value + "%'", [], 
             function(tx, res){ 

              if(res.rows.length > 0) 
              { 
                var template = ""; 
                for (var i = 0; i < res.rows.length; i++) { 


                 var id = res.rows.item(i).value + '/ID: ' + res.rows.item(i).id; 
                 template += '<option class="aCon" id="' + id + '" value="' + res.rows.item(i).value + '"></option>'; 
                }; 

                document.getElementById('locValues').innerHTML = template; 
              } 
              else 
               console.log("No records found") 
             }, 
             function(ex){ 
              console.log("Populate Location Error: " + ex.message); 
             }); 
          }); 
        } 
        catch(ex) 
        { 
          console.log("Populate Location Error: " + ex.message); 
        } 
       }; 
     }; 

我能夠獲取記錄形成SQLite和追加到DataList，但自動完成功能不顯示在用戶界面。

任何想法我錯了？

在此先感謝

Answer 1

此代碼應工作：

var divtoappend=angular.element(document.querySelector('#locValues')); 
divtoappend.append("<option class="aCon" id="' + id + '" value="' + res.rows.item(i).value + '"></option>");