在codeigniter中使用jQuery $ .post动态加载页面

Question

我有一个主页，其中有两个DIV（左和右）。 在左边div我将有一些项目。并在右边div其细节。 （请看图片）

这里，点击左侧div中的项目，其相应的详细信息应该被加载。 我对这两个div有两个不同的视图。我可以从控制器功能加载左视图。

但是我应该根据左div项的item_id加载正确的div而不刷新任何页面。

为此，我将通过jQuery item_id发送$.post并获取details_page。

我对详细信息页面的看法是为了填充

<div class="title"><?php echo $title; ?></div>
<div class="details">
    <div class="author"><?php echo $author; ?></div>
    <div class="pagedata"><?php echo $pagedata; ?></div>
</div>

当加载详细信息页面时，应该替换这些PHP变量。

请帮我在codeigniter中使用jQuery对上述场景进行编码。

Answer 1

在PHP控制器中，您需要一个为视图提供服务的方法：

class Foo extends CI_Controller {
    public function getItem($item) {
        // the view holds the html for the right div
        $this->load->view($item);
    }   
}

在jquery中，您可以像这样获取视图：

$.get('example.com/foo/getItem/item1', function(resp){
    $('#contentDiv').html(resp);
}, 'html'); 

当然，每次使用适当的项目名称单击左侧div上的窗格时，您都会调用此jquery代码段。