Bài tiếp theo của website truyện tranh này, sẽ là phần hiển thị chi tiết các thông tin của một chapter,…
Ở bài trước chúng ta đã cho hiển thị cơ bản được 1 chapter rồi, tiếp theo mình sẽ hiển thị chi tiết một chút. Các phần được hiển thị gồm: tên chapter, tên truyện, hình ảnh của chapter, phần chapter phía trước, chapter phía sau, có thể chọn một chapter bất kỳ…
1 Chúng ta sẽ hiển thị hình ảnh của chapter
Dữ liệu thì chúng ta đã lấy ở bài trước, chỉ việc hiển thị thôi, và việc hiển thị các ảnh trong một chapter mình cũng đã hướng dẫn lúc thêm dữ liệu vào phần review một chapter á, đây là đoạn code để hiển thị ở file /app/View/Pages/detail_chap.ctp:
[php]
<div class="row" style="text-align: center;">
<div style="margin-top: 10px;" class="span12">
<?php $url = $dataChapter[‘Chapter’][‘link_img’];
$url_arr = explode("#", $url);
if(!empty($url_arr)){
foreach($url_arr as $row){
?>
<img src="<?php echo $row?>" alt="" style="max-width: 100%;"/><br />
<?php }
}
?>
</div>
</div>
[/php]
Chạy lại page sẽ thấy xuất hiện các ảnh thuộc chapter đó(đương nhiên các bạn phải có dữ liệu nhá)
2 Hiển thị thông tin một truyện
Phần này tuỳ chọn theo layout các bạn nhá. Ở đây mình chỉ hiển thị tên của truyện thôi, các bạn có thể hiển thị thêm.
Lấy thông tin truyện trong /app/Controller/PagesController.php
[php]
//thong tin truyen
$id_story = $dataChapter[‘Chapter’][‘story_id’];
$dataStory = $this->Story->find(‘first’, array(
‘conditions’=>array(‘Story.id’=>$id_story, ‘Story.status’=> 1),
‘recursive’=>-1
));
$data[‘dataStory’] = $dataStory;
[/php]
Hiển thị ngoài view /app/View/Pages/detail_chap.ctp
[html]
<h3><span><?php echo $dataStory[‘Story’][‘name’]?></span></h3>
[/html]
3 Hiển thị chương trước, chương sau, select chọn 1 chapter bất kỳ cakephp
Đầu tiên là cái select chọn chapter nhá:
Nội dung lấy các chapter cùng truyện với chapter đang xem trong PagesController.php
[php]
//Lấy tất cả các chapter cùng truyện
$dataListChapter = $this->Chapter->find(‘all’, array(
‘conditions’=>array(‘story_id’ => $id_story),
‘fields’ => array(‘name’, ‘id’),
‘order’ =>array(‘id’=>’DESC’),
‘recursive’=>-1
));
$data[‘dataListChapter’] = $dataListChapter;
[/php]
Khi đó khi ở ngoài view chúng ta chỉ cần kiểm tra và foreach dữ liệu như sau:
[php]
<div class="span3">
<?php
if(!empty($data["dataListChapter"])):
$dataListChapter = $data["dataListChapter"];
?>
<select class="form-control changechapter">
<?php foreach ($dataListChapter as $key => $value):?>
<?php $link = Router::url(
array(
‘controller’ => ‘pages’,
‘action’=> ‘detail_chap’,
‘slug1’ => strtolower(Inflector::slug($dataStory[‘Story’][‘name’])),
‘slug2’ => strtolower(Inflector::slug($value[‘Chapter’] [‘name’])),
‘id’ => $value[‘Chapter’][‘id’],
));
?>
<option <?php echo ($this->request->params[‘id’] == $value[‘Chapter’][‘id’]) ? "selected" : ""?> value="<?php echo $link;?>"><?php echo $value[‘Chapter’][‘name’]?></option>
<?php endforeach;?>
</select>
<?php endif;?>
</div>
[/php]
Ở đoạn trên có chổ $this->request->params[‘id’] sử dụng để lấy được param id được truyền đi trên router.
Chương trước và chương sau:
Trong CakePHP có hỗ trợ chúng ta lấy được dữ liệu trước và sau của một dữ liệu, cú pháp như sau:
Kết quả đoạn này sẽ trả về mảng trước là prev và sau là next, để thấy rõ hơn các bạn print_r dữ liệu ra xem.
[php]
//Lấy thông tin chương trước và chương sau:
$field = "id";
$value = $id;
$neighbors = $this->Chapter->find(
‘neighbors’,
array(
‘fields’=>array(‘name’, ‘id’),
‘conditions’=>array(‘Chapter.story_id’ => $id_story),
‘field’ => $field, ‘value’ => $value
)
);
$data[‘dataNeighbors’] = $neighbors;
[/php]
Đoạn hiển thị chương trước như sau:
[php]
<?php
$dataChapterPrev = $data[‘dataNeighbors’][‘prev’];
if(!empty($dataChapterPrev)){
echo $this->Html->link("Chương trước",
array(
‘controller’ => ‘pages’,
‘action’ => ‘detail_chap’,
‘slug1’ => strtolower(Inflector::slug($dataStory[‘Story’][‘name’])),
‘slug2’ => strtolower(Inflector::slug($dataChapterPrev[‘Chapter’][‘name’])),
‘id’ => $dataChapterPrev[‘Chapter’][‘id’],
),array(‘class’=>’btn btn-success’,’role’=>’button’,’escape’=> false ));
}
?>
[/php]
và chương sau
[php]
<?php
$dataChapterNext = $data[‘dataNeighbors’][‘next’];
if(!empty($dataChapterNext)){
echo $this->Html->link("Chương sau",
array(
‘controller’ => ‘pages’,
‘action’ => ‘detail_chap’,
‘slug1’ => strtolower(Inflector::slug($dataStory[‘Story’][‘name’])),
‘slug2’ => strtolower(Inflector::slug($dataChapterNext[‘Chapter’][‘name’])),
‘id’ => $dataChapterNext[‘Chapter’][‘id’],
),array(‘class’=>’btn btn-success’,’role’=>’button’,’escape’=> false ));
}
?>
[/php]
Chúng ta tiến hành chạy lại page và click vào các button chương trước, chương sau để xem kết quả. Nó sẽ chuyển sang các chương theo lựa chọn.
Với view detail_chap.ctp này mình muốn khi người dùng chọn các chap trong select sẽ chuyển ngay đến chapter đó, nên mình thêm đoạn javascript sau vào cuối file:
[html]
<script type="text/javascript">
$(document).on(‘change’, ".changechapter", function() {
window.location.href = $(this).val();
});
</script>
[/html]
Còn 1 việc nữa là phải thay đổi link để vào chi tiết chapter đã làm ở bài trước. Chúng ta vào file /app/View/Pages/detail_story.ctp.
Chúng ta thay thế đoạn link hiển thị tên chapter bằng đoạn sau:
[php]
<?php $link = Router::url(
array(
‘controller’ => ‘pages’,
‘action’=> ‘detail_chap’,
‘slug1’ => strtolower(Inflector::slug($data_Story[‘name’])),
‘slug2’ => strtolower(Inflector::slug($value[‘Chapter’] [‘name’])),
‘id’ => $value[‘Chapter’][‘id’],
));
?>
<a href="<?php echo $link;?>"><?php echo $value["Chapter"]["name"]?></a>
[/php]
Đến đây thì phần chi tiết truyện và chapter đã hoàn thành, các bạn có thể thêm các chức năng khác để cho website mình thêm hoàn thiện như: like, share, comment …
Bài tiếp theo mình sẽ thay đổi các nội dung dưới footer, nav bên phải trang chi tiết truyện, làm các banner … hy vọng các bạn theo dõi với nongdanit
[create_button_post thamso1=” thamso2=’Demo’ thamso3=’http://nongdanit.info/download/cakephp/bai33/doctruyen.zip’] [/create_button_post]
[thongbao]
- Nếu có thắc mắc gì các bạn để lại comment bên dưới mình sẽ trả lời sớm nhất có thể.
- Cảm ơn các bạn đã đọc.
[/thongbao]