動態自動完成基於類別

Question

我有一個問題，當我試圖創建一個基於組合框使用codeigniter的動態值自動完成， 我已經嘗試使用Ajax並沒有成功。

這裏是在類調用的項目我的Ajax代碼

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#jenis").change(function(){    
     $.ajax({ 
      type : "POST", 
      url: "<?php echo base_url(); ?>whz/admin/get_item", 
      dataType: "html", 
      data : "item=" + $("#jenis").val(), 
      success: function(data) 
      { 
       $("#showitem").text(data); 
      } 
     }); 
    }); 
}); 
</script> 

這是我的自動完成的jQuery代碼

<div id="showitem"> 
    <script> 
    $(function() { 
     var availableTags = [ 
     <?php foreach ($item as $row){ 
       echo '"'.$row->item_name.'",';}?> 
     ]; 
     $("#autotags").autocomplete({ 
     source: availableTags 
     }); 
    }); 
    </script> 
</div> 

，這裏是我的控制器

public function get_item() 
    { 
     $this->load->model('whz_model'); 
     $category = $this->input->post('item'); 
     $item=$this->whz_model->get_item_by_cat($category); 
     $script = ' 
      $(function() { 
      var availableTags = ['; 
      foreach ($item as $row) 
      { 
       $script .= '"'.$row->item_name.'",'; 
      } 

     $script .= ']; 
      $("#autotags").autocomplete({ 
       source: availableTags 
      }); 
      });'; 

     echo $script; 
    } 

我使用考慮JSON作爲另一種選擇，但我仍然沒有足夠的使用經驗。

遺憾的英語不好， 感謝您的幫助

Answer 1

我已經用另一種方法我在互聯網上找到解決這個問題，它可能是不是最好的，但它與我的作品， 這裏是鏈接

http://www.danielrosca.ro/blog/en/codeigniter-autocomplete/

感謝您對您所有的答案

Answer 2

這對於僅基於文檔，因爲我沒有任何系統方便，我可以試試。

您告訴jQuery您的AJAX響應是"html"這意味着您加載的JavaScript永遠不會被執行，我相信。可能的話，如果您將數據加載爲"script"，那麼它會起作用，但更好的方法確實是使用JSON。然後

你的AJAX調用是這樣的：

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#jenis").change(function(){    
     $.ajax({ 
      type : "POST", 
      url: "<?php echo base_url(); ?>whz/admin/get_item", 
      dataType: "json", 
      data : "item=" + $("#jenis").val(), 
      success: function(data) 
      { 
       availableTags = data; 
      } 
     }); 
    }); 
}); 
</script> 

有了這樣的控制器：

public function get_item() 
{ 
    $this->load->model('whz_model'); 
    $category = $this->input->post('item'); 
    $item=$this->whz_model->get_item_by_cat($category); 

    $this->output 
     ->set_content_type('application/json') 
     ->set_output(json_encode($item))); 
} 

你將不得不暴露變量availableTags全球範圍內爲這個工作，你可以實現通過更改您的DOM到

<div id="showitem"> 
    <script> 
    $(function() { 
     availableTags = [ 
     <?php foreach ($item as $row){ 
       echo '"'.$row->item_name.'",';}?> 
     ]; 
     $("#autotags").autocomplete({ 
     source: availableTags 
     }); 
    }); 
    </script> 
</div> 

您可能還會喜歡t將其公開爲window.availableTags，這樣您就可以在瀏覽器的控制檯中檢查它的值。

正如在開始時提到的，我沒有測試這個，但我相信它應該可以工作。