CodeIgniter中Select2下拉框选产品后显示详情报错求助

我看了你的CodeIgniter POS系统代码，问题主要出在几个细节上，导致选择产品后无法正常显示详情。下面我逐一拆解问题并给出修正方案：

核心问题点 #

1. AJAX请求参数与控制器接收不匹配：前端传的参数是prod_id，但控制器里却在接收item_name，直接导致数据库查询不到对应数据
2. 重复加载jQuery库：页面同时加载了jquery.js和jquery.min.js，容易引发JS冲突
3. 无效的Autocomplete代码：你已经在用Select2组件，没必要再绑定jQuery UI的autocomplete，而且写法也不符合语法规范
4. AJAX参数拼写错误：datatype应该是dataType（首字母大写），可能导致响应解析异常
5. Select2初始化位置不够规范：虽然能运行，但统一放在DOM加载完成的回调里更稳妥

修正后的关键代码 #

1. View页面代码（重点修正部分） #

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/bootstrap/css/bootstrap.css'); ?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/pos_style.css') ?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/select2/select2.min.css') ?>">
<!-- 只保留一个jQuery库，避免冲突 -->
<script type="text/javascript" src="<?php echo base_url('assets/js/jquery.min.js') ?>"></script>
<script type="text/javascript" src="<?php echo base_url('assets/jquery-ui/jquery-ui.js') ?>"></script>
<script type="text/javascript">
$( document ).ready(function() {
    // 移除无效的autocomplete代码，Select2已经足够
    $("#item").on('change',function() {
        var prod_id = $(this).val();
        var item_info = $("#right");
        $.ajax ({
            type : 'POST',
            url : "<?php echo base_url(); ?>get/item_info",
            data : {"prod_id":prod_id}, // 参数名与控制器接收保持一致
            dataType : 'html', // 修正拼写，明确返回类型为HTML
            success : function(result) {
                item_info.html(result);
            },
            // 新增错误回调，方便调试
            error: function(xhr, status, error) {
                console.log("AJAX请求错误: " + error);
                item_info.html("<div class='lb'><label>加载失败，请重试</label></div>");
            }
        });
    });

    // 以下add、process事件代码保持不变...
});
</script>
</head>
<body>
<!-- 页面原有结构保持不变 -->

<!-- 将Select2初始化移到DOM ready回调中 -->
<script src="<?php echo base_url() ?>assets/select2/select2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#item').select2({
        placeholder: "选择产品",
        allowClear: true
    });
});
</script>
</body>
</html>

2. Get控制器代码（修正参数接收） #

public function item_info() {
    $name = "";
    $price = "";
    $prod_code = "";
    // 改为接收正确的prod_id参数
    $prod_id = $this->input->post('prod_id');
    $this->load->model('ajax_model');
    // 移除不必要的urldecode，POST参数已自动解码
    $item_info = $this->ajax_model->item_info($prod_id);
    
    if ($item_info) {
        $pid= $item_info->prod_id;
        $name = $item_info->prod_desc;
        $price = $item_info->original_price;
        $prod_code = $item_info->prod_code;
?>
<div class="lb">
<label id="name">Product Name : <?php echo $name ?></label>
</div>
<div class="lb">
<label id="code">Prod Code: <?php echo $prod_code ?></label>
</div>
<div class="lb">
<label id="prc">Price : ₱<span id="price"><?php echo $price ?></span></label>
</div>
<?php
    }else {
?>
<div class="lb">
<label id="name">No Item Found</label>
</div>
<?php
    }
}

3. Model代码（简化查询逻辑） #

public function item_info($prod_id) {
    $this->load->database();
    // 直接使用传入的prod_id查询即可
    $sql = $this->db->where('prod_id', $prod_id)->get('products');
    return $sql->row();
}

public function getProduct(){
    $this->load->database();
    $sql = $this->db->get('products');
    return $sql->result();
}

额外调试建议 #

• 打开浏览器开发者工具（F12），查看Network标签，确认AJAX请求是否正确发送了prod_id参数，以及控制器返回的响应内容
• 检查CodeIgniter的日志文件（application/logs/目录），查看是否有数据库查询错误或其他报错信息
• 确保products表中的prod_id字段类型，与下拉框传递的value类型一致（比如都是整数或字符串）

内容的提问来源于stack exchange，提问作者maine shar