Thứ Năm, 23 tháng 6, 2016

Phần 8 - Tạo file 'dieu_huong.php' cho web

- Tại file 'index.php' , bạn thêm thuộc tính valign="top" ở 3 cột td (cột trái , cột giữa , cột phải).Vì mặc định các ô td trong bảng table là canh giữa văn bản theo chiều cao , them thuộc tính valign="top" là để văn bản luôn phía trên trong ô td

- Code sau khi thêm như sau :


<tr>
    <td width="170px" valign="top" >
    <?php
        include("chuc_nang/menu_doc/menu_doc.php");
    ?>
    </td>
    <td width="650px" valign="top" >Cột giữa</td>
    <td width="170px" valign="top" >Cột phải</td>
</tr>

- Tại file 'menu_doc.php' , bạn gán biến 'link' trong vòng lặp while có giá trị là $link="?thamso=xuat_san_pham&id=".$tv_2['id'];. Sau đó echo (xuất) cái link đó vào liên kết menu (chính là thẻ a).Code sau khi sửa file 'menu_doc.php' như sau :

<?php
    $tv="select * from menu_doc order by id";
    $tv_1=mysql_query($tv);
    echo "<div class='menu_doc' >";
    while($tv_2=mysql_fetch_array($tv_1))
    {
        $link="?thamso=xuat_san_pham&id=".$tv_2['id'];
        echo "<a href='$link'>";
            echo $tv_2['ten'];
        echo "</a>";
    }
    echo "</div>";
?>

- Cách viết $tv_2['id'] thì bạn có thể xem lại về lệnh mysql_fetch_array ở phần 5.Ở đây nhắc lại cách viết là $tv_2['tên cột hoặc trường']

- Cách sửa code trên là nhằm vào mục đích đưa liên kết vào menu dọc ( ở đây là truyền biến có tên là 'thamso' vào url và có giá trị là 'xuat_san_pham').Sau đó bạn truy cập lại trang chính và bạn bấm vào các menu dọc thì bạn sẽ nhận được các liên kết tương tự như sau trên trình duyệt web :

+ ?thamso=xuat_san_pham&id=1
+ ?thamso=xuat_san_pham&id=2
+ ?thamso=xuat_san_pham&id=3
+ ?thamso=xuat_san_pham&id=4
+ ?thamso=xuat_san_pham&id=5
+ ?thamso=xuat_san_pham&id=6
+ ?thamso=xuat_san_pham&id=7
+ ?thamso=xuat_san_pham&id=8

- Bạn để ý rằng cái chỗ id sẽ có giá trị khác nhau.Nghĩa là khi bạn bấm vào menu nào thì sẽ liên kết đến trang web có đường dẫn web chứa id của menu đó.Và bạn sẽ nhờ vào các id này để xuất sản phẩm ra theo danh mục

- Tiếp theo bạn tạo thư mục 'san_pham' trong thư mục 'hinh_anh' , sau đó sao chép các hình ảnh trong thư mục '1' của phần file đính kèm vào thư mục 'san_pham' (để làm hình minh họa xuất sản phẩm)

- Bạn tạo file 'dieu_huong.php' tại thư mục 'chuc_nang'.Sau đó bạn tạo thư mục 'san_pham' trong thư mục 'chuc_nang' , rồi tạo file 'xuat.php' trong thư mục 'san_pham'

- File 'dieu_huong.php' dùng để viết code điều hướng trang web ở phần cột giữa.Nghĩa là khi có người lướt vào web của bạn , người ta sẽ vào các trang web khác nhau , ví dụ người lướt web có thể vào trang chủ của web nhưng cũng có thể vào trang xuất sản phẩm (hoặc vào 1 trang xuất tin tức ) ...Thế nên bạn cần viết 1 đoạn code để điều hướng web vào đúng nơi mà người lướt web muốn vào

- Tại file 'index.php' phần ô cột giữa , bạn xóa từ 'Cột giữa' đi và thêm đoạn code sau :

<?php
    include("chuc_nang/dieu_huong.php");
?>

- Code này là gọi file 'dieu_huong.php' vào file 'index.php'.Sau đó bạn thêm đoạn code sau vào file 'dieu_huong.php' :

<?php
    if(isset($_GET['thamso'])){$tham_so=$_GET['thamso'];}else{$tham_so="";}
    switch($tham_so)
    {
        case "xuat_san_pham":
            include("chuc_nang/san_pham/xuat.php");
        break;
        default:
            echo "trang chủ";
    }
?>

+ $_GET['thamso'] là để lấy giá trị biến 'thamso' trên url( trên liên kết web hiện tại )

+ Hàm isset là để kiểm tra 1 biến có tồn tại chưa , nếu tồn tại trả về giá trị 'true' , ngược lại là 'flase'

+ Như vậy viết if(isset($_GET['thamso'])){$tham_so=$_GET['thamso'];}else{$tham_so="";} ý là gán biến 'tham_so' là giá trị biến 'thamso trên url' ($_GET['thamso']) , nhưng nếu giá trị biến 'thamso trên url' chưa có thì biến 'tham_so' có giá trị là rỗng

+ Còn lệnh switch thì tùy tham biến đầu vào là gì mà viết code như thế nào (có thể hiểu là 1 sự lựa chọn tùy theo tham biến).Ở đây tham biến đầu vào là biến 'tham_so' , tạm thời phân ra 2 trường hợp , trường hợp 1 là biến 'tham_so' có giá trị là 'xuat_san_pham' , còn trường hợp 2 là các trường hợp còn lại (trường hợp mặc định (default))

+ Nếu rớt vào trường hợp 2 (mặc định) thì xuất từ 'trang chủ' ra ở cột giữa , còn nếu là trường hợp 1 thì gọi file 'xuat.php' trong thư mục 'chuc_nang/san_pham' (file này nhằm mục đích viết code xuất sản phẩm ra)


- Kết thúc phần này thì code file 'index.php' như sau :

<?php
    include("ket_noi.php");
?>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Web bán hàng</title>
        <style type="text/css" >          
            div.menu_ngang a
            {
                color:blue;
                margin-left: 10px;
                margin-right: 10px;
                text-decoration: none;
                font-size:20px;
            }
            div.menu_ngang a:hover
            {
                color:red
            }
            div.menu_doc a
            {
                color:blue;
                text-decoration: none;
                display:block;
            }
            div.menu_doc a:hover
            {
                color:red
            }
        </style>
    </head>
    <body>
        <center>
            <table width="990px">
                <tr>
                    <td colspan="3"><img src="hinh_anh/banner.JPG" ></td>
                </tr>
                <tr>
                    <td colspan="3" height="50px" >
                        <?php
                            include("chuc_nang/menu_ngang/menu_ngang.php");
                        ?>
                    </td>
                </tr>
                <tr>
                    <td width="170px" valign="top" >
                    <?php
                        include("chuc_nang/menu_doc/menu_doc.php");
                    ?>
                    </td>
                    <td width="650px" valign="top" >
                        <?php
                            include("chuc_nang/dieu_huong.php");
                        ?>
                    </td>
                    <td width="170px" valign="top" >Cột phải</td>
                </tr>
                <tr>
                    <td colspan="3">Footer</td>
                </tr>
            </table>
        </center>
    </body>
</html>