CodeIgniter 4中Select2搜索结果无法显示跳转链接的问题求助

你的控制器代码已经正确返回了课程ID和名称，无需修改，只需调整前端Select2的配置即可实现点击跳转需求，以下提供两种可行方案：

方案一：自定义搜索结果模板，直接渲染可点击链接 #

通过templateResult配置自定义下拉列表的渲染方式，将每个搜索结果转为带跳转链接的<a>标签，同时保持选中项的正常显示：

修改视图中的JS代码：

$('.search').select2({
    placeholder: '--- What do you want to learn today? ---',
    ajax: {
        url: '<?php echo base_url('Home/ajaxSearch');?>',
        dataType: 'json',
        delay: 250,
        processResults: function(data){
            return {
                results: data
            };
        },
        cache: true
    },
    // 自定义搜索结果的渲染模板
    templateResult: function(item) {
        if (item.loading) {
            return item.text;
        }
        // 创建跳转链接，拼接courseID
        var $a = $('<a>').attr('href', '../course/' + item.courseID).text(item.text);
        return $a;
    },
    // 自定义选中项的显示文本
    templateSelection: function(item) {
        return item.text;
    }
});

点击下拉列表中的链接即可直接跳转，同时select框会保留选中的课程名称。

方案二：监听选择事件，选中后自动跳转 #

如果需要保留select的表单特性，可监听select2:select事件，在用户选中选项后自动跳转：

修改视图中的JS代码：

$('.search').select2({
    placeholder: '--- What do you want to learn today? ---',
    ajax: {
        url: '<?php echo base_url('Home/ajaxSearch');?>',
        dataType: 'json',
        delay: 250,
        processResults: function(data){
            return {
                results: data
            };
        },
        cache: true
    }
}).on('select2:select', function(e) {
    // 获取选中课程的ID并跳转
    var courseID = e.params.data.courseID;
    window.location.href = '../course/' + courseID;
});

额外建议 #

为避免相对路径可能导致的跳转错误，建议使用CodeIgniter的base_url生成绝对路径，比如将跳转链接改为：

window.location.href = '<?php echo base_url('course/');?>' + courseID;

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