Question

我想在CodeIgniter中创建一个搜索功能。我的视图文件分为两部分：

标题部分，其中包含搜索栏

<?php echo form_open('controller/live_search');?>
    <div class="toolbar-icon-bg hidden-xs" id="toolbar-search">
        <div class="input-group">
            <span class="input-group-btn"><button class="btn" type="button"><i class="ti ti-search"></i></button></span>
            <input type="text" name="search" id="search" class="form-control" placeholder="Search...">
            <span class="input-group-btn"><button class="btn" type="button"><i class="ti ti-close"></i></button></span>
        </div>
    </div>
    <?php echo form_close();?>

正文部分，其中包含搜索结果。

<div class="static-content-wrapper">
                <div class="static-content">
                    <div class="page-content">
                        <ol class="breadcrumb">

                            <li class=""><a href="<?php echo base_url();?>">Home</a></li>
                            <li class="active">Search</li>

                        </ol>
                        <div class="container-fluid">

                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="panel panel-white">
                                        <div class="panel-heading">
                                            <h2><!-- Panel --></h2>
                                        </div>
                                        <div class="panel-body">
                                            <div style="clear:both;"></div>
                                            <div id="update"><!-- search results will be added here --></div>
                                        </div>  
                                        <div class="panel-footer">
                                            <span class="text-gray"><em>Footer</em></span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div> <!-- .container-fluid -->
                    </div> <!-- #page-content -->
                </div>

在我的控制器中，我编写了以下代码：

public function live_search()
    {

        //load page template    
        $this->load->view('templates/header');
        $this->load->view('templates/sidebar');
        $this->load->view('templates/live_search');
        $this->load->view('templates/footer');
    }

我想“激活”“live_search”公共功能，只需选择搜索字段即可。举个例子，你可以想到Netflix的搜索功能。当您选择搜索栏时，会自动加载黑页并开始输入您的搜索结果。

因此，当我选择搜索文本字段时，我的脚本应该加载“templates / live_search”页面。

我怎么能这样做？谢谢你的支持。

Answer 1

像这样的DOM操作不是在服务器上的CodeIgniter中完成的，它在JS中完成了客户端站点。你需要JS来监听搜索输入焦点，然后你的＆＃34;实时搜索页面中的AJAX＆＃34; （不清楚你想要什么），或者在初始页面加载时加载所有内容，然后只显示＆＃34;实时搜索页面＆＃34;在搜索栏的焦点上。

如果你正在使用jQuery，它可能看起来像这样：

df1.join(df2, df1("id")===df2("id"), "left").select(df2("id"), df1("name"), df2("salary"))

Codeigniter - 如何只需点击搜索字段即可加载搜索页面？

1 个答案: