自動完成 - 警予

Question

我想添加一個字段具有自動完成功能，我用JavaScript來此

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css " /> 
    <script src="http://code.jquery.com/jquery-1.8.2.js "></script> 
    <script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js "></script> 
<script> 
    $(function() { 
     var availableTags = [ 
      "ActionScript", 
      "AppleScript", 
      "Asp", 
      "BASIC", 
      "C", 
      "C++", 
      "Clojure", 
      "COBOL", 
      "ColdFusion", 
      "Erlang", 
      "Fortran", 
      "Groovy", 
      "Haskell", 
      "Java", 
      "JavaScript", 
      "Lisp", 
      "Perl", 
      "PHP", 
      "Python", 
      "Ruby", 
      "Scala", 
      "Scheme" 
     ]; 
     function split(val) { 
      //document.write(val.length); 
      return val.split(/,\s*/); 
     } 
     function extractLast(term) { 
      //echo (term.length); 
      //document.write(term.length); 
      return split(term).pop(); 
     } 

     $("#Tag_tag_name") 
      // don't navigate away from the field on tab when selecting an item 
      .bind("keydown", function(event) { 
       var a=0; 
//    if (event.keyCode === $.ui.keyCode.TAB) 
//     { 
//      a=a+1; 
//     } 
       if (event.keyCode === $.ui.keyCode.TAB && 
         $(this).data("autocomplete").menu.active) { 

        event.preventDefault(); 

       } 
//    if (event.keyCode === $.ui.keyCode.P) 
//     { 
//      alert(a); 
//     } 


      }) 
      .autocomplete({ 
       minLength: 0, 
       source: function(request, response) { 
        // delegate back to autocomplete, but extract the last term 
        response($.ui.autocomplete.filter(
         availableTags, extractLast(request.term))); 
       }, 
       focus: function() { 
        // prevent value inserted on focus 
        return false; 
       }, 
       select: function(event, ui) { 
        var terms = split(this.value); 
        // remove the current input 
        terms.pop(); 
        // add the selected item 
        terms.push(ui.item.value); 
        // add placeholder to get the comma-and-space at the end 
        terms.push(""); 
        this.value = terms.join(", "); 
        return false; 
       } 
      }); 
    }); 
</script> 

現在我想做TOT做的就是代替AvaialbleTags可變我想從價值這個靜態值數據庫？另外，我想限制三個值由用戶添加。

任何人都可以幫助我嗎？

Answer 1

下面是我使用multicomplete

$this->widget('ext.widgets.MultiComplete', array(
       'model'=>$model, 
       'attribute'=>$attribute, 
       'splitter'=>',', 
       'sourceUrl'=>$this->createUrl($url), 
    // additional javascript options for the autocomplete plugin 
       'options'=>array(
         'minLength'=>'1', 
    ), 
       'htmlOptions'=>array(
         'size'=>'60' 
        ), 
        ));