【问题标题】:Live search using codeigniter Json Mysql Ajax Jquery使用codeigniter Json Mysql Ajax Jquery进行实时搜索
【发布时间】:2013-05-31 07:37:03
【问题描述】:

我正在使用 Jquery Ajax、Php Codeigniter 和 Mysql 进行实时搜索项目
这个搜索类似于 http://w3schools.com/ajax/ajax_aspphp.asp 但使用 MYSql

这是我的数据库表:

CREATE TABLE IF NOT EXISTS `ix08s_subjects` (
  `SUB_ID` int(11) NOT NULL AUTO_INCREMENT,
  `NAME` varchar(211) DEFAULT NULL,
  `added_by` int(11) DEFAULT NULL,
  `date_added` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
  PRIMARY KEY (`SUB_ID`),
  KEY `FK_ix08s_subjects` (`added_by`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 COMMENT='to store the subjects' AUTO_INCREMENT=3 ;

--

-- 转储表ix08s_subjects的数据

INSERT INTO `ix08s_subjects` (`SUB_ID`, `NAME`, `added_by`, `date_added`) VALUES
(1, 'physics', 2, '2013-05-31 10:07:55'),
(2, 'physics', 2, '2013-05-31 10:41:09');

这是我的模型代码- 主题模型.php

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Subjectmodel extends CI_Model {
   public function __construct() {
        parent::__construct();
    }
    function getSubject($search){
        $this->db->select("SUB_ID,NAME");
        $whereCondition = array('NAME' =>$search);
        $this->db->where($whereCondition);
        $this->db->from('ix08s_subjects');
        $query = $this->db->get();
        return $query->result();
    }
}
?>

这是我的控制器代码- 主题.php

<?php
class Subject extends CI_Controller {
    function __construct() {
        parent::__construct();
        $this->load->model('SubjectModel');
    }
    public function index(){
        $search=  $this->input->post('search');
        $query = $this->SubjectModel->getSubject($search);
        echo json_encode ($query);
        $this->load->view('search', $query);
    }
}
?>

这是我的查看代码- 搜索.php

<html>
<head>

<script type="text/javascript" language="javascript" src="http://somexyz/js/javascripts/plugin/jquery.js"></script>
<script type="text/javascript" src="http://somexyz/js/javascripts/plugin/json2.js"></script>
<script>
    $(document).ready(function(){
      $("#search").keyup(function(){
        if($("#search").val().length>3){
        $.ajax({
            type: "post",
            url: "http://localhost/ibps/index.php/subject",
            cache: false,               
            data:'search='+$("#search").val(),
            dataType: 'json',
            success: function(response){
                $('#finalResult').html("");
                var obj = JSON.parse(response);
                if(obj.length>0){
                    try{
                        var items=[];   
                        $.each(obj, function(i,val){                                            
                            items.push($('<li/>').text(val.NAME));
                        }); 
                        $('#finalResult').append.apply($('#finalResult'), items);
                    }catch(e) {     
                        alert('Exception while request..');
                    }       
                }else{
                    $('#finalResult').html($('<li/>').text("No Data Found"));       
                }       

            },
            error: function(){                      
                alert('Error while request..');
            }
        });
        }
        return false;
      });
    });
</script>
</head>
<body>
<div id="container">

<input type="text" name="search" id="search" />
<ul id="finalResult"></ul>
</div>
</body>
</html>

每当我在搜索框中输入四个字母时,我都会弹出此警告

请求时出错..

没有从数据库中获取值

【问题讨论】:

  • error while request.... 通过在控制台中查看来获取实际的错误详细信息。

标签: php jquery mysql ajax codeigniter


【解决方案1】:

问题在于http://localhost/ibps/index.php/subject的返回格式。

您已添加该行:

$this->load->view('search', $query);

与您之前的问题“Live search using Codeigniter Mysql”相比。这可能是在输出中添加一个 html 模板,而不是 ajax 调用所期望的 json

看看Return JSON with CodeIgniter

【讨论】:

  • 如果我删除它,我的输出中根本看不到任何搜索框@James Birkett
  • http://localhost/ibps/index.php/subject 的输出在 ajax 调用中使用时不应包含任何 html,因为响应必须是 json。
  • @SoteroAranguren 如果可以的话,你能接受答案吗?谢谢。
猜你喜欢
  • 2013-05-26
  • 2017-09-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-02-13
相关资源
最近更新 更多