Ý kiến học viên

Trần Hoàng Thiện

Trần Hoàng Thiện

Chất lượng học và giảng dạy tốt, hướng dẫn tận tình, truyền thụ kiến t...
  • - Phone : 0944418192
  • - Email : thienhb12@gmail.com
  • - Facebook : Xem
Cao Minh Tùng

Cao Minh Tùng

Chất lượng giảng dạy tốt.Giảng viên chỉ bảo tận tình không hiểu co thể...
  • - Phone : 01675641992
  • - Email : caominhtung64@gmail.com
  • - Facebook : Xem
Đặng Cao Sơn

Đặng Cao Sơn

Khóa học dễ hiểu, giảng viên nhiệt tình, nhiều tình bài tập tình huốn...
  • - Phone : 0938204886
  • - Email : soncshs1986@gmail.com
  • - Facebook : Xem
Viết đánh giá

Viết đánh giá

Về chất lượng đào tạo, website

Đánh giá của học viên

Ý kiến của học viên

Xem đánh giá của học viên về phpandmysql.net

Sử dụng ajax - trang web nhạc đơn giản phần 2

Tiếp theo phần một, chúng ta đã truyền id của ca sỹ sang PHP để truy vấn cơ sở dữ liệu để lấy ra thông tin và albums của các sỹ, sau đó từ PHP sẽ trả lại thông tin đã xử lý được lại cho javascript
Nếu ai chưa xem phần 1 thì có thể xem lại tại đây nhé

Tại trang process.php chúng ta sẽ lấy được ID của ca sỹ thông qua biến $_GET['id'], sau đó truy vấn với database để lấy ra thông tin của ca sỹ và các album thuộc ca sỹ đó
<?php
    file process.php
    
    $type = $_GET['type']; // cờ kiểm tra hành động
    $singerid = $_GET['id']; // id của ca sỹ lấy được từ js
?>
Mở class singers lên, ta viết hàm getsinger() để lấy ra thông tin của ca sỹ, và hàm getalbums() để lấy ra các album của ca sỹ
<?php
    file singers.php
    
    protected $_table = "tbl_singers";
    protected $_album = "tbl_albums";
    public function getsinger($singerid){
       $sql = "select * from $this->_table where singer_id = '$singerid'";
       $this->query($sql);
       return $this->fetch();  
    }
   
    public function getalbums($singerid){ 
       $sql = "select * from $this->_album where singer_id ='$singerid'";
       $this->query($sql);
       return $this->fetchAll();
    }
?>
- Tại trang process ta gọi class singers ra và lấy đổ ra thông tin ca sỹ và đồng thời đổ ra các album thuộc ca sỹ này
<?php
    file process.php
    
    require("libraries/config.php");
    require("libraries/database.php");
    require("libraries/singers.php");    

    $type = $_GET['type']; // cờ kiểm tra hành động
    $singerid = $_GET['id']; // id của ca sỹ lấy được từ js
    $singers = new singers(); // sử dụng class singers
    if($type == "singer"){ // lấy ra thông tin của ca sỹ
       
    }elseif($type == "album"){ // lấy ra các bài hát của album
       
    }else{ // chơi nhạc
    }
?>
- Vì chúng ta có nhiều hàm xử lý đều gửi từ js sang file process.php nên nếu không sử dụng thuật toán thì khó có thể biết chúng ta đang cần xử lý thông tin gì, thông tin ca sỹ hay album hay là chơi nhạc, vì thế biến $type có chức năng như một cái cờ do ta định nghĩa ra để kiểm tra xem thông tin truyến từ js sang là gì

  1. Nếu là singer có nghĩa là ta đang cần lấy thông tin ca sỹ
  2. Nếu là album có nghĩa là ta cần lấy các bài hát thuộc album này
  3. Còn lại sẽ là để điều khiển play nhạc khi ta click vào một bài hát

- Tiếp tục, ta đổ ra thông tin ca sỹ và các album của ca sỹ này ra một vùng ID là "singers" tại trang index.php

<?php
    file process.php
      
    $type = $_GET['type']; // cờ kiểm tra hành động
    $singerid = $_GET['id']; // id của ca sỹ lấy được từ js
    $singers = new singers(); // sử dụng class singers
    if($type == "singer"){ // lấy ra thông tin của ca sỹ
       $singerinfo = $singers->getsinger($singerid);
       $listalbum = $singers->getalbums($singerid);

       // bắt đầu đổ thông tin ca sỹ
       
       echo "<hr />";
       echo "<div class='left'>";
         echo "<h3>".$singerinfo['singer_name']."</h3>";
         echo "<img src='images/$singerinfo[singer_image]' width='160' />";
       echo "</div>";
       echo "<div class='right'>";
         echo "<p><strong>Thông tin</strong></p>";
         echo "<p>".$singerinfo['singer_info']."</p>";
       echo "</div>";

       // Bắt đầu đổ ra thông tin các album

       echo "<h3>Các albums của $singerinfo['singer_name']</h3>";
       if($listalbum != NULL){ // ca sỹ này có album
          echo "<ul>";
          foreach($listalbum as $items){
             echo "<li><a href='#'>".$items['album_title']."</a></li>";
          }
          echo "</ul>";
       }else{ // ca sỹ chưa có album
          echo "Hiện chưa có album nào";
       }

    }
?>
Khi ta echo thì kết quả nó tự động trả về cho js nhé ( trả về cho hàm processsinger()  mà ta khai báo ở htt.onreadystatechange = processsinger trong hàm singers() của file ajax.js)

Tại hàm processinger() nhận kết quả trả về bằng hàm http.responseText , sau đó ta đổ ra <div id="singers"></div> bằng cú pháp document.getElementById("singers"). innerHTML = http.responseText

Và đây là kết quả



Như vậy là chúng ta đã lấy được thông tin ca sỹ và các album của ca sỹ, giờ chúng ta cần làm thế nào để khi click vào tên album thì sẽ đổ ra danh sách các bài hát thuộc album này?

Ta cân viết một hàm albums() để lấy ra các bài hát thuộc album, tại tên album ta viết sự kiện onclick = "albums(id album)" để lấy ra danh sách các bài hát

<?php
    <a href="#" onclick="albums(albumid)">tên album</a>
?>
- Viết hàm albums, mở file ajax.js

File ajax.js 

function albums(albumid){
    http.open("GET","process.php?type=album&id="+albumid);
    http.onreadystatechange = responsealbum;
    http.send(null);            
}
Hàm albums này chúng ta đang truyền vào albumid được lấy khi click chuột vào tên album nhé, tương tự như phần lấy thông tin ca sỹ thui, biến $type = album để truyền sang file process.php với mục đích thông báo cho ta biết là hành động này ta cần lấy ra các bài hát thuộc album.

Kết quả trả sau khi được xử lý trả về cho hàm responsealbum() nhé chứ không phải responsesinger() nữa vì ta đang khai báo ở http.onreadystatechange = responsealbum mà :P
Bạn vẫn chưa hiểu vấn đề, bạn cần người trợ giúp?. Hãy click vào đây để gửi câu hỏi, mọi người sẽ support cho bạn