javascript 使用 AJAX 和 CodeIgniter 创建实时搜索
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22020567/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Creating live search with AJAX and CodeIgniter
提问by jasonayer
I'm trying to create a live search feature in CI (which I've never done before). I'm pretty new to web development and am still learning things. I found this little tutorial on how to do it http://www.blog.orionwebtech.net/codeigniter-jquery-ajax-live-search/?codekitCB=415037771.748888
我正在尝试在 CI 中创建一个实时搜索功能（我以前从未做过）。我对 Web 开发还很陌生，并且仍在学习。我发现这个关于如何做的小教程http://www.blog.orionwebtech.net/codeigniter-jquery-ajax-live-search/?codekitCB=415037771.748888
I'm having issues translating the code from that tutorial for my app. I have a table called properties and I want the input value to be compared against the slug column and the name column. And then I want it to return the slug and the name in the live search results where the input value matches either of those columns. It wont match both because the slug contains only numbers and the name contains letters.
我在为我的应用程序翻译该教程中的代码时遇到问题。我有一个名为 properties 的表，我希望将输入值与 slug 列和 name 列进行比较。然后我希望它在输入值与这些列中的任何一列匹配的实时搜索结果中返回 slug 和名称。它不会同时匹配，因为 slug 只包含数字而名称包含字母。
This is the code I came up with to try and do this.
这是我想出的代码来尝试执行此操作。
The View:
风景：
<div class="something">
<input name="search_data" id="search_data" class="" value="" data-label="Search for a property, a unit, or an resident..." type="text" />
<div id="suggestions">
<div id="suggestionslist">
</div>
</div>
</div>
The JavaScript:
JavaScript：
<script type="text/javascript">
function ajaxSearch() {
var input_data = $('#search_data').val();
if (input_data.length === 0) {
$('#suggestions').hide();
} else {
var post_data = {
'search_data': input_data,
'<?php echo $this->security->get_csrf_token_name(); ?>': '<?php echo $this->security->get_csrf_hash(); ?>'
};
$.ajax({
type: "POST",
url: "<?php echo base_url(); ?>search/autocomplete",
data: post_data,
success: function(data) {
// return success
if (data.length > 0) {
$('#suggestions').show();
$('#autoSuggestionsList').addClass('auto_list');
$('#autoSuggestionsList').html(data);
}
}
});
}
}
</script>
The Controller:
控制器：
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Search extends CI_Controller
{
public function __construct()
{
parent::__construct();
}
public function autocomplete()
{
$search_data = $this->input->post('search_data');
$query = $this->Search_model->get_autocomplete($search_data);
foreach ($query->result() as $row):
echo "<li><a href='" . base_url('association/'.$row->slug) . "'>" . $row->name . "</a></li>";
endforeach;
}
}
/* End of file search.php */
/* File location: application/controllers */
The Model:
该模型：
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Search_model extends CI_Model
{
public function __construct()
{
$this->load->database();
}
public function get_autocomplete($search_data)
{
$this->db->select('slug, name');
$this->db->like('slug', $search_data);
$this->db->like('name', $search_data);
return $this->db->get('properties', 10);
}
}
?>
When I tested it I didnt get any results. My test data is valid because there is a matching row in the db. What am I doing wrong?
当我测试它时，我没有得到任何结果。我的测试数据有效，因为数据库中有匹配的行。我究竟做错了什么？
回答by Prathamesh mhatre
As per your link you are missing onkeyup=ajaxSearch();i.e
根据您的链接，您缺少onkeyup=ajaxSearch();即
<input name="search_data" id="search_data" class="" value=""
data-label="Search for a property, a unit, or an resident..."
type="text" onkeyup="ajaxSearch();" />
回答by Mazen Mezlini
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Search_model extends CI_Model
{
public function __construct()
{
parent::__construct();
}
public function get_autocomplete($search_data)
{
$this->db->select('slug, name');
$this->db->like('slug', $search_data);
$this->db->like('name', $search_data);
$query = $this->db->get('properties', 10);
return $query->result();
}
}
?>
