2013-04-03 92 views
1

我試圖將超過20 000個項目(客戶端信息)的選擇轉移到自動完成的輸入字段,以加快窗體的加載速度。jquery-autocomplete默認選擇

目前我使用的是自動完成Dyve插件(https://github.com/dyve/jquery-autocomplete.git

,我面對的是,我不能設置的默認值在現場爲我選擇做的問題。

我原來的代碼是:

... 
<td> 
    <a href="#" onClick="document.form1.blank_sel_numeroclient.value = '<?php echo("$row_rs_detail[numeroclient]");?>';"> 
     <img src="images/blocnote.png" width="20" height="15" alt="Modifier" /> 
    </a> 
</td> 
... 
<td align="left" colspan="2"> 
    <select name="blank_sel_numeroclient" id="blank_sel_numeroclient" style="width:475px; text-align:left" > 
     <option value="" selected="selected"></option> 
     <?php 
      do 
      { 
       echo("<option value=\"".$row_rs_clients['numeroclient']."\">".$row_rs_clients['numeroclient']."&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;".$row_rs_clients['nom']."</option>\n"); 
      } while ($row_rs_clients = mysql_fetch_assoc($rs_clients)); 
      $rows = mysql_num_rows($rs_clients); 
      if($rows > 0) 
      { 
       mysql_data_seek($rs_clients, 0); 
       $row_rs_clients = mysql_fetch_assoc($rs_clients); 
      } 
     ?> 
    </select> 
</td> 
... 

現在,我嘗試使用代碼: 主要HTML清單當然,客戶autocomplete.php的

... 
<link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css"> 
<script src="JavascriptFiles/jquery.autocomplete.min.js" type="text/javascript"></script> 
... 
<td> 
    <!-- This is not working -->   
    <a href="#" onClick="document.form1.blank_sel_numeroclient.value   = '<?php echo($row_rs_clients['numeroclient']);?>';"> 
     <img src="images/blocnote.png" width="20" height="15" alt="Modifier" /> 
    </a> 
</td> 
... 
<td align="left" colspan="2"> 
    <script> 
     $(document).ready(function() { 
      $('#blank_sel_numeroclient').autocomplete('cedule/liste-client-autocomplete.php', 
       { 
        minChars: 1, 
        useCache: false, 
        selectFirst: true, 
        selectOnly: true, 
        sortResults: true 
       }); 
     }); 
    </script> 
    <input type="text" id="blank_sel_numeroclient" name="blank_sel_numeroclient" style="width:475px; text-align:left" /> 
    <input type="hidden" value="" id="blank_sel_numeroclienthidden" name="blank_sel_numeroclienthidden" /> 
</td> 
... 

內容:

<?php 
    // si on reçoit une donnée 
    if(isset($_GET['q'])) { 
     $q = htmlentities($_GET['q']); // protection 

     // connexion à la base de données 
     try { 
      $bdd = new PDO('mysql:host=somehost;dbname=somedatabase', 'someusername', 'somepassword'); 
      $bdd->exec("SET CHARACTER SET utf8"); 
     } catch(Exception $e) { 
      exit('Impossible de se connecter à la base de données.'); 
     } 
     // écriture de la requête 
     $requete = "SELECT CONCAT_WS('\t',numeroclient,nom) as nom FROM clients WHERE numeroclient LIKE '". $q ."%' ORDER BY LENGTH(numeroclient), numeroclient"; 
     // exécution de la requête 
     $resultat = $bdd->query($requete) or die(print_r($bdd->errorInfo())); 
     // affichage des résultats 
     while($donnees = $resultat->fetch(PDO::FETCH_ASSOC)) { 
      echo $donnees['nom'] ."\n"; 
     } 
    } 
?> 

所以我想要「精確」的原始代碼相同的效果,但與輕量級的autoc完整的功能,因爲數據庫中超過20 000個項目需要加載。 (2.2MB僅用於選擇值...)

所以如果有人能告訴我一種方法來做到這一點或更好的一個,因爲我現在卡住了。

最好的問候, 防暴

回答

0

好吧終於摸索出的東西!

通過與

... 
<td> 
    <!-- Seems to work -->   
    <a href="#" onClick="document.form1.blank_sel_numeroclient.value = '<?php echo($row_rs_detail['numeroclient']."\t".$row_rs_detail['cl_nom']);?>';"> 
     <img src="images/blocnote.png" width="20" height="15" alt="Modifier" /> 
    </a> 
</td> 
... 

更換

... 
<td> 
    <!-- This is not working -->   
    <a href="#" onClick="document.form1.blank_sel_numeroclient.value   = '<?php echo($row_rs_clients['numeroclient']);?>';"> 
     <img src="images/blocnote.png" width="20" height="15" alt="Modifier" /> 
    </a> 
</td> 
... 

似乎解決默認的選擇問題。 您似乎需要提供自動完成列表中的完整項目,包括格式化以便能夠通過腳本調用「選擇它」。

所以作爲我的名單SQL請求結果是:CONCAT_WS('\t',numeroclient,nom)

,對於例如將結果爲:「19078 [TAB CHAR]史密斯夫婦」

我必須提供輸入字段值節點同樣如此:

echo($row_rs_detail['numeroclient']."\t".$row_rs_detail['cl_nom']); 

這將轉化爲相同: 「19078 [TAB CHAR]史密斯夫婦」

然後正確填寫輸入字段!

不知道它是否有意義,但它對我有用!

最好的問候,並希望它可以幫助別人!

RiOt