I want to upload file using php ajax then insert all the data such as chapter name, lesson name and id on database. How can i do that? pls help me guys. Thank you :)

Well first you need to create a form. Then assaign the php page to the action value.

Your question is not clear. I can help but you need to add more details. Like if you know how to create a form and catch the values using php. Are you a beginner or you are having a problem?

I already know the basics in php. however, my problem is that, I want to know how to upload files and move those uploaded files on a certain directory inside my computer. Another thing is, I want to know also how INSERT data on my database named 'tbl_lesson' with col 'id_no,ch_name,ls_name' after uploading. How do i do that using PHP and AJAX

Member Avatar
diafol

It would help if you posted the code you have so far and we could show you where to go from there. Are you familiar with passing files via Ajax? e.g. FormData object? Have a look here:

http://blog.teamtreehouse.com/uploading-files-ajax

If you posted the code that you have used then we can give you a idea.

<?php
session_start();

    if(isset($_SESSION['username'])){

        $user_id = $_SESSION['ID'];
        $user_fname = $_SESSION['Firstname'];
        $user_Mname = $_SESSION['Middlename'];
        $user_Lname = $_SESSION['Lastname'];
        $user_position = $_SESSION['position'];
        $c = $_SESSION['grp_code'];

    }else{
        header("Location:index.php");   
    }

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="_STYLES/page_layout.css" rel="stylesheet" type="text/css" />
<title>Upload Lesson</title>
<link href="_STYLES/style_admin/upload-lesson.css" rel="stylesheet" type="text/css" />
<script src="_SCRIPTS/jquery-1.11.2.js"></script>
<script src="_SCRIPTS/upload_lesson.js"></script>
</head>

<body>
<div id="container">
<div id="header"></div>
<div id="main_content">

<div id="tab_content">
        <form id="upl_lesson" enctype="multipart/form-data" method="post">

            <label class="headers">Fill up the form about the lessons to be uploaded</label>
        <p class="p_headers2">The system will only accept powerpoint presentation or files 
        with .ppt extensions for the lesson to be uploaded. Also, please make sure that you fill up the form correctly.
        </p>
         <label id="lbl_successfull">Lesson has been successfully uploaded !!</label>
        <a class="hidden" name="grp_co" id="grp_code"><?php echo $c;?></a>
        <a class="hidden" name="id" id="uid"><?php echo $user_id; ?></a>
        <select id="sl_chapter" name="ch_no">
            <option value="0"> -- Select Chapter --</option>
            <option value="ch1"> Chapter 1</option>
            <option value="ch2"> Chapter 2</option>
            <option value="ch3"> Chapter 3</option>
            <option value="ch4"> Chapter 4</option>
            <option value="ch5"> Chapter 5</option>
            <option value="ch6"> Chapter 6</option>
            <option value="ch7"> Chapter 7</option>
            <option value="ch8"> Chapter 8</option>
            <option value="ch9"> Chapter 9</option>
            <option value="ch10"> Chapter 10</option>
        </select>
        <label id="lbl_error_chapter">Sorry you have inputted an invalid chapter.</label>
        <input type="text" placeholder="Type the chapter name" id="txt_chapter" name="chap_name" />
        <label id="lbl_error_txtchapter">Invalid chapter name .</label>
            <select id="sl_lesson" name="ls_no">
            <option value="0"> -- Select Lesson --</option>
            <option value="ls1"> Lesson 1</option>
            <option value="ls2"> Lesson 2</option>
            <option value="ls3"> Lesson 3</option>
            <option value="ls4"> Lesson 4</option>
            <option value="ls5"> Lesson 5</option>
            <option value="ls6"> Lesson 6</option>
            <option value="ls7"> Lesson 7</option>
            <option value="ls8"> Lesson 8</option>
            <option value="ls9"> Lesson 9</option>
            <option value="ls10"> Lesson 10</option>
        </select>
        <label id="lbl_error_lesson">Sorry you have inputted an invalid lesson number.</label>
        <input type="text" placeholder="Type the lesson name" id="txt_lesson" name="lessn_name" />
        <label id="lbl_error_txtlesson">Invalid lesson name .</label>
        <textarea placeholder="Type the brief information of the lesson to be uploaded" id="txtarea_sum" name="brief_sum"></textarea>
        <label id="lbl_error_sum">Brief information about the lesson must be filled up </label>
        <input type="file" id="file_browser" name="browse"/>
        <label id="lbl_err_file">No file selected, please upload again</label>
        <a id="pg_val"></a><a id="total_size_upl"></a>
        <progress id="pg_bar" value="0" max="100"></progress>
        <input type="button" id="btn_upload_lesson" value="Upload" onclick="uploadfile();" name="btnupload"  />

        </form>
    </div>
    <!--#tab_content-->  
    <div id="curr_page_title">

            <label id="curr_page_title_header">Lesson Panel</label> 
            <hr /> 
            <img src="#" id="ico_curr_page_title" />
            <label id="lbl_curr_page_title">Upload Lessons</label>
            <p id="p_curr_page_title">Upload all the lessons that will be given by their teacher</p>

    </div>
    <!--#curr_page_tite-->
     <div id="menu"><div style="font-weight:bold;color:#666;font-family:Century Gothic;font-size:16px;">
        Menu</div>
         <hr />
        <div id="menu_item">

          <a href="view-lesson.php" name="pg_view_lesson"><img src="icons/home_icon.png" />
          <label id="mn_view_lesson">View Lessons</label></a>
            <a href="upload-lesson.php" name="pg_upload_lesson"><img src="icons/account_icon.png" /> 
             <label id="mn_upload_lesson">Upload Lessons</label></a>
            <a href="remove-lesson.php" name="pg_remove_lesson"> <img src="icons/monitor_icon.png" />
            <label id="mn_remove_lesson">Remove Lessons</label></a>
             <a href="home.php" name="pg_back_home"> <img src="icons/back_to_home_icon.png" />
            <label id="mn_back_home">Back to Home</label></a>

        </div>

</div>
<!--#main_content-->
</div><!--#container-->
<div id="footer">
  <div id="footer_content">©E-Learning System - Introduction to Programming - is currently under development phase and 50% completed. This system is created for Saint Michael's College of Laguna, Platero Binan City Philippines.</div>
</div>
</body>
</html>
This is the code of the page design(HTML/PHP):



    <?php
    session_start();

        if(isset($_SESSION['username'])){

            $user_id = $_SESSION['ID'];
            $user_fname = $_SESSION['Firstname'];
            $user_Mname = $_SESSION['Middlename'];
            $user_Lname = $_SESSION['Lastname'];
            $user_position = $_SESSION['position'];
            $c = $_SESSION['grp_code'];

        }else{
            header("Location:index.php");   
        }

    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="_STYLES/page_layout.css" rel="stylesheet" type="text/css" />
    <title>Upload Lesson</title>
    <link href="_STYLES/style_admin/upload-lesson.css" rel="stylesheet" type="text/css" />
    <script src="_SCRIPTS/jquery-1.11.2.js"></script>
    <script src="_SCRIPTS/upload_lesson.js"></script>
    </head>

    <body>
    <div id="container">
    <div id="header"></div>
    <div id="main_content">

    <div id="tab_content">
            <form id="upl_lesson" enctype="multipart/form-data" method="post">

                <label class="headers">Fill up the form about the lessons to be uploaded</label>
            <p class="p_headers2">The system will only accept powerpoint presentation or files 
            with .ppt extensions for the lesson to be uploaded. Also, please make sure that you fill up the form correctly.
            </p>
             <label id="lbl_successfull">Lesson has been successfully uploaded !!</label>
            <a class="hidden" name="grp_co" id="grp_code"><?php echo $c;?></a>
            <a class="hidden" name="id" id="uid"><?php echo $user_id; ?></a>
            <select id="sl_chapter" name="ch_no">
                <option value="0"> -- Select Chapter --</option>
                <option value="ch1"> Chapter 1</option>
                <option value="ch2"> Chapter 2</option>
                <option value="ch3"> Chapter 3</option>
                <option value="ch4"> Chapter 4</option>
                <option value="ch5"> Chapter 5</option>
                <option value="ch6"> Chapter 6</option>
                <option value="ch7"> Chapter 7</option>
                <option value="ch8"> Chapter 8</option>
                <option value="ch9"> Chapter 9</option>
                <option value="ch10"> Chapter 10</option>
            </select>
            <label id="lbl_error_chapter">Sorry you have inputted an invalid chapter.</label>
            <input type="text" placeholder="Type the chapter name" id="txt_chapter" name="chap_name" />
            <label id="lbl_error_txtchapter">Invalid chapter name .</label>
                <select id="sl_lesson" name="ls_no">
                <option value="0"> -- Select Lesson --</option>
                <option value="ls1"> Lesson 1</option>
                <option value="ls2"> Lesson 2</option>
                <option value="ls3"> Lesson 3</option>
                <option value="ls4"> Lesson 4</option>
                <option value="ls5"> Lesson 5</option>
                <option value="ls6"> Lesson 6</option>
                <option value="ls7"> Lesson 7</option>
                <option value="ls8"> Lesson 8</option>
                <option value="ls9"> Lesson 9</option>
                <option value="ls10"> Lesson 10</option>
            </select>
            <label id="lbl_error_lesson">Sorry you have inputted an invalid lesson number.</label>
            <input type="text" placeholder="Type the lesson name" id="txt_lesson" name="lessn_name" />
            <label id="lbl_error_txtlesson">Invalid lesson name .</label>
            <textarea placeholder="Type the brief information of the lesson to be uploaded" id="txtarea_sum" name="brief_sum">

This is the code of the page design(HTML/PHP):

        <?php
        session_start();

            if(isset($_SESSION['username'])){

                $user_id = $_SESSION['ID'];
                $user_fname = $_SESSION['Firstname'];
                $user_Mname = $_SESSION['Middlename'];
                $user_Lname = $_SESSION['Lastname'];
                $user_position = $_SESSION['position'];
                $c = $_SESSION['grp_code'];

            }else{
                header("Location:index.php");   
            }

        ?>
        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link href="_STYLES/page_layout.css" rel="stylesheet" type="text/css" />
        <title>Upload Lesson</title>
        <link href="_STYLES/style_admin/upload-lesson.css" rel="stylesheet" type="text/css" />
        <script src="_SCRIPTS/jquery-1.11.2.js"></script>
        <script src="_SCRIPTS/upload_lesson.js"></script>
        </head>

        <body>
        <div id="container">
        <div id="header"></div>
        <div id="main_content">

        <div id="tab_content">
                <form id="upl_lesson" enctype="multipart/form-data" method="post">

                    <label class="headers">Fill up the form about the lessons to be uploaded</label>
                <p class="p_headers2">The system will only accept powerpoint presentation or files 
                with .ppt extensions for the lesson to be uploaded. Also, please make sure that you fill up the form correctly.
                </p>
                 <label id="lbl_successfull">Lesson has been successfully uploaded !!</label>
                <a class="hidden" name="grp_co" id="grp_code"><?php echo $c;?></a>
                <a class="hidden" name="id" id="uid"><?php echo $user_id; ?></a>
                <select id="sl_chapter" name="ch_no">
                    <option value="0"> -- Select Chapter --</option>
                    <option value="ch1"> Chapter 1</option>
                    <option value="ch2"> Chapter 2</option>
                    <option value="ch3"> Chapter 3</option>
                    <option value="ch4"> Chapter 4</option>
                    <option value="ch5"> Chapter 5</option>
                    <option value="ch6"> Chapter 6</option>
                    <option value="ch7"> Chapter 7</option>
                    <option value="ch8"> Chapter 8</option>
                    <option value="ch9"> Chapter 9</option>
                    <option value="ch10"> Chapter 10</option>
                </select>
                <label id="lbl_error_chapter">Sorry you have inputted an invalid chapter.</label>
                <input type="text" placeholder="Type the chapter name" id="txt_chapter" name="chap_name" />
                <label id="lbl_error_txtchapter">Invalid chapter name .</label>
                    <select id="sl_lesson" name="ls_no">
                    <option value="0"> -- Select Lesson --</option>
                    <option value="ls1"> Lesson 1</option>
                    <option value="ls2"> Lesson 2</option>
                    <option value="ls3"> Lesson 3</option>
                    <option value="ls4"> Lesson 4</option>
                    <option value="ls5"> Lesson 5</option>
                    <option value="ls6"> Lesson 6</option>
                    <option value="ls7"> Lesson 7</option>
                    <option value="ls8"> Lesson 8</option>
                    <option value="ls9"> Lesson 9</option>
                    <option value="ls10"> Lesson 10</option>
                </select>
                <label id="lbl_error_lesson">Sorry you have inputted an invalid lesson number.</label>
                <input type="text" placeholder="Type the lesson name" id="txt_lesson" name="lessn_name" />
                <label id="lbl_error_txtlesson">Invalid lesson name .</label>
                <textarea placeholder="Type the brief information of the lesson to be uploaded" id="txtarea_sum" name="brief_sum">

This is the code for AJAX using XMLHttpRequest:

// JavaScript Document

$(document).ready(function(){
    $("#pg_bar").hide();
    $("#lbl_error_chapter").hide();
    $("#lbl_error_lesson").hide();
    $("#lbl_error_sum").hide();
    $("#lbl_successfull").hide();
    $("#lbl_error_txtchapter").hide();
    $("#lbl_error_txtlesson").hide();
    $("#lbl_err_file").hide();
    $(".hidden").hide();


    $("#txt_chapter").keypress(function(){
        if($("#txt_chapter").val().length > 1){
            $("#lbl_error_txtchapter").hide();
            $("#txt_chapter").css("border-color","DodgerBlue"); 
        }   
    });
    $("#txt_lesson").keypress(function(){
        if($("#txt_lesson").val().length > 1){
            $("#lbl_error_txtlesson").hide();
            $("#txt_lesson").css("border-color","DodgerBlue");  
        }       
    });



});


function _(el){
    return document.getElementById(el); 
}
function uploadfile(){

    var ch_no = document.getElementById('sl_chapter').value;
    var ls_no = document.getElementById('sl_lesson').value;
    var txtch = document.getElementById('txt_chapter').value;
    var txtls = document.getElementById('txt_lesson').value;
    var file = document.getElementById('file_browser').value;
    var id = document.getElementById('grp_code').text;

    if(ch_no == "0"){
        $("#lbl_error_chapter").show();
        $("#sl_chapter").css("border-color","#F00");    
    }else{
        $("#lbl_error_chapter").hide();
        $("#sl_chapter").css("border-color","DodgerBlue");  
    }
    if(ls_no == "0"){
        $("#lbl_error_lesson").show();
        $("#sl_lesson").css("border-color","#F00"); 
    }else{
        $("#lbl_error_lesson").hide();
        $("#sl_lesson").css("border-color","DodgerBlue");       
    }
    if(txtch == ""){
        $("#lbl_error_txtchapter").show();
        $("#txt_chapter").css("border-color","#F00");   
    }
    if(txtls == ""){
        $("#lbl_error_txtlesson").show();
        $("#txt_lesson").css("border-color","#F00");    
    }
    if(file == ""){
        $("#lbl_err_file").show();
    }


    if(!(file == "") && !(ch_no == "0") && !(ls_no == "0") && !(txtch == "") && !(txtls == "")){
        var file = _("file_browser").files[0];
        var formData = new FormData();
        formData.append("browse",file);
        var ajax = new XMLHttpRequest();
            ajax.upload.addEventListener("progress",progressHandler,false);
            ajax.addEventListener("load",completeHandler,false);
            ajax.addEventListener("error",errorHandler,false);
            ajax.addEventListener("abort",abortHandler,false);
            ajax.open("POST","includes/upload_file.php");
            ajax.send(formData);

        $("#pg_bar").show();    

    }

}
function progressHandler(e){
    _("total_size_upl").innerHTML = e.loaded+ "B / " + e.total + "B";
    var p = (e.loaded / e.total) * 100;
    _("pg_bar").value = Math.round(p) ;
    _("pg_val").innerHTML = Math.round(p) + "%";

    $("#btn_upload_lesson").attr("disabled","disabled");
    $("#file_browser").attr("disabled","disabled"); 
    $("#sl_chapter").attr("disabled","disabled");
    $("#sl_lesson").attr("disabled","disabled");    
    $("#txt_chapter").attr("disabled","disabled");
    $("#txt_lesson").attr("disabled","disabled");   
    $("#txtarea_sum").attr("disabled","disabled");
}
function completeHandler(e){
    var p = 0;
    _("pg_val").innerHTML = e.target.responseText;
    _("pg_bar").value = Math.round(p);

    setTimeout(function(){
                $("#lbl_successfull").show();
        },100);
    setTimeout(function(){
                window.location.href="upload-lesson.php";
        },3000);

}
function errorHandler(e){
    _("pg_val").innerHTML = "Upload failed";
}
function abortHandler(e){
    _("pg_val").innerHTML = "Upload failed";
}

This is the php code for uploading files which fires up by AJAX XMLHttpRequest:

<?php
include_once("C:/wamp/www/site/elearning/includes/db_connect.php");

    $filename = $_FILES["browse"]["name"];
    $filename = $filename."_".mt_rand(10000,99999);
    $temp_filename = $_FILES["browse"]["tmp_name"];
    $file_type = $_FILES["browse"]["type"];
    $file_size = $_FILES["browse"]["size"];
    $file_error = $_FILES["browse"]["error"];

    $filename = preg_replace('#[^a-z0-9.]#i',"",$filename);
    $path = "C:/wamp/www/site/elearning/lesson/$filename";

    if(!$temp_filename){
        echo "No file selected, please upload again";
    }
    if(move_uploaded_file($temp_filename,"C:/wamp/www/site/elearning/lesson/$filename")){
        echo "Upload Complete"; 
    }else{
        echo "Upload file failed";
    }


?>

I can now upload files on my server. my problem now is that how can i passed the variable values from the ajax XMLHttpRequest() to the php file which holds codes to INSERT data from the database.

My database name is tbl_lesson
column : id_no, ch_code, ls_code, date, filename, filesize, file_description

the full codes of my page is at the top. sorry for the flood post

To upload a file to a certain directory use the move_uploaded_file() function.
Look it up in php.net

And to insert a new database record use INSERT INTO database_name (table colums sepereted by comma) VALUES (Values posted via form)

Thank you for your response. I've already solve that problem with regards on uploading file on my web server and inserting file data from my html to database. However, I encountered another problem. It doubles the data entered on the database, why is that happen?
Here is my code for uploading files:

<?php
include_once("C:/wamp/www/site/elearning/includes/db_connect.php");

    $id = $_POST['grp_co'];
    $ch_num = $_POST['ch_no'];
    $ls_num = $_POST['ls_no'];
    $lesson_desc = $_POST['brief_sum'];

    $filename = $_FILES['browse']['name'];
    $filename = mt_rand(10000,99999)."_".$filename;
    $temp_filename = $_FILES['browse']['tmp_name'];
    $file_type = $_FILES['browse']['type'];
    $file_size = $_FILES['browse']['size'];
    $file_error = $_FILES['browse']['error'];

    $date_month = date("m");
    $date_d = date("d");
    $date_year = date("Y");
    $date = date($date_month."/".$date_d."/".$date_year);
    $path = "C:/wamp/www/site/elearning/lesson/$filename";

    if(strlen($lesson_desc) < 1){
        $lesson_desc = "No description";    
    }

    if(!$temp_filename){
        echo "No file selected, please upload again";
    }

    $sql = "INSERT into tbl_lesson(id_no,date,ch_code,ls_code,file_name,file_size,file_path,description)
            VALUES('".$id."','".$date."','".$ch_num."','".$ls_num."','".$filename."','".$file_size."',
            '".$path."','".$lesson_desc."')";
    mysqli_query($cn,$sql);
    move_uploaded_file($temp_filename,"C:/wamp/www/site/elearning/lesson/$filename");

    if(mysqli_query($cn,$sql)){
        echo "Upload Complete"; 
    }
exit();

?>

Here is my code for AJAX:

// JavaScript Document

$(document).ready(function(){
    $(".lbl_cgrp_error").hide();
    $("#ico_loading").hide();
    $("#prompt").hide();
    $("#user_id").hide();


    $("#txt_grp_name").keypress(function(){
        if($("#txt_grp_name").val().length >=4){
            $("#err_grpname").hide();
            $("#txt_grp_name").css("border-color","DodgerBlue");    
        }   
    });

    $("#btn_create_grp").click(function(){
        var isGrpnameOk = false,isGrpProgOk = false;
        var name = document.getElementById('txt_grp_name').value;
        var program = document.getElementById('sl_course').value;
        var user_id = document.getElementById('user_id').text;
        var grp_code = document.getElementById('a_grp_code').text;
        var grp_desc = document.getElementById('txtarea_grp_description').value;
        var _data = 'grp_name='+name+'&course='+program+'&uid='+user_id+'&code='+grp_code+'&description='+grp_desc;

        if($("#txt_grp_name").val().length < 4){
            $("#err_grpname").show();
            $("#txt_grp_name").css("border-color","#F00");

        }else{
            $("#err_grpname").hide();
            $("#txt_grp_name").css("border-color","DodgerBlue");    
            isGrpnameOk = true; 
        }
        if(program == '0'){
            $("#err_grpcourse").show();
            $("#sl_course").css("border-color","#F00");     
        }else{
            $("#err_grpcourse").hide();
            $("#sl_course").css("border-color","DodgerBlue");   
            isGrpProgOk = true; 
        }   

            if(isGrpnameOk == true && isGrpProgOk == true){

                $.ajax({

                        type: "POST",
                        url: "includes/create_grp.php",
                        data:_data,
                        success: function(s){
                            setTimeout(function(){
                                $("#ico_loading").show();
                                $("#txt_grp_name").attr("disabled","disabled");
                                $("#sl_course").attr("disabled","disabled");
                                $("#txtarea_grp_description").attr("disabled","disabled");
                            },500);

                            setTimeout(function(){
                                    $("#prompt").show();
                                    $("#ico_loading").hide();
                                },3000);
                            setTimeout(function(){
                                    location.reload();
                                },7000);

                        }   

                });
                return false;

            }// END IF -- boolean


    }); // END OF $("#button")


});

Page COde HTML

<?php
session_start();
if(!(isset($_SESSION["ID"]) || !(isset($_SESSION["username"]) ) ) ){
    header("Location:index.php");
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="_STYLES/page_layout.css" rel="stylesheet" type="text/css" />
<link href="DataTables-1.10.9/media/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script src="_SCRIPTS/jquery-1.11.2.js"></script>
<script src="DataTables-1.10.9/media/js/jquery.js"></script>
<script src="DataTables-1.10.9/media/js/jquery.dataTables.js"></script>
<title>View Lesson</title>
<link href="_STYLES/style_admin/view-lesson.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="container">
<div id="header"></div>
<div id="main_content">

  <div id="tab_content">
    <label class="headers">Show all uploaded lessons</label>
        <div id="lesson_container">
          <table id="tbl_upld_lesson" cellspacing="0" class="display">
            <thead>
                <tr>
                        <th></th>
                        <th>Date</th>
                        <th>Chapter Code</th>
                        <th>Lesson Code</th>
                        <th> Filename </th>
                        <th></th>
                </tr>
            </thead>
            <tbody>

                 <tr>
                        <td>1</td>
                        <td>9/18/2015</td>
                        <td> Chapter 1: Intro</td>
                         <td> Lesson 1: Intro2</td>
                        <td> Introduction.ppt</td>
                        <td><input type="button" value="Download" id="btndownload" /></td>
                </tr>

                <tr>
                        <td>2</td>
                        <td>9/18/2015</td>
                        <td> Chapter 1: Intro</td>
                        <td> Lesson 1: Intro2</td>
                        <td> Introduction.ppt</td>
                        <td><input type="button" value="Download" id="btndownload" /></td>
              </tr>

            </tbody>

            </table>      
        </div>
        <!-- #Lesson Container -->
<script>
$(document).ready(function(){
    $("#tbl_upld_lesson").DataTable();
});
</script>
  </div>
   <!--#tab_content-->
  <div id="curr_page_title">
            <label id="curr_page_title_header">Lesson Panel</label> 
            <hr /> 
            <img src="#" id="ico_curr_page_title" />
            <label id="lbl_curr_page_title">View Lessons</label>
            <p id="p_curr_page_title">Show all uploaded lesson</p>
</div>


    <div id="menu"><div style="font-weight:bold;color:#666;font-family:Century Gothic;font-size:16px;">
        Menu</div>
         <hr />
        <div id="menu_item">
         <?php 
            if($_SESSION['position'] == "Administrator"){
             echo "<a href='view-lesson.php' name='pg_view_lesson'><img src='icons/home_icon.png' />";
             echo "<label id='mn_view_lesson'>View Lessons</label></a>";
             echo "<a href='upload-lesson.php' name='pg_upload_lesson'><img src='icons/account_icon.png' /> ";
             echo "<label id='mn_upload_lesson'>Upload Lessons</label></a>";
             echo "<a href='remove-lesson.php' name='pg_remove_lesson'> <img src='icons/monitor_icon.png' />";
             echo "<label id='mn_remove_lesson'>Remove Lessons</label></a>";
             echo "<a href='home.php' name='pg_back_home'> <img src='icons/back_to_home_icon.png' />";
             echo "<label id='mn_back_home'>Back to Home</label></a>";
            }
            if($_SESSION['position'] == "Student"){
             echo "<a href='view-lesson.php' name='pg_view_lesson'><img src='icons/home_icon.png' />";
             echo "<label id='mn_view_lesson'>View Lessons</label></a>";
             echo "<a href='home.php' name='pg_back_home'> <img src='icons/back_to_home_icon.png' />";
             echo "<label id='mn_back_home'>Back to Home</label></a>";
            }
         ?>
        </div>
    </div>
<!--#menu_item-->
</div><!--#container-->
<div id="footer">
  <div id="footer_content">&copyE-Learning System - Introduction to Programming - is currently under development phase and 50% completed. This system is created for Saint Michael's College of Laguna, Platero Binan City Philippines.</div>
</div>


</body>
</html>