Php+javascript+html upload pdfs and browse PDF courseware

Simple to make PHP website in winter vacation, need to realize the simple function of browsing PDF and uploading PDF online, the following is a brief introduction of this function. The implementation effect is as follows:
1. When the user login, click the "Upload Courseware" hyperlink can be implemented to hide and display the function of uploading table;
2. When the user chooses the uploaded courseware, the PDF is uploaded to the local webpage folder and inserted into the database;
3. When you click on the relevant PDF teaching courseware, you can realize the online browsing function.
Site Layout Reference: PHP Web site using JavaScript and iframe simple to achieve partial refresh effect





one. Hide/Show TableHere 's how to hide and display a table or div with a click of a hyperlink via JavaScript, as shown in the code below:

The core code is through <script language= "JavaScript"; </script> defines the JavaScript function, sets the Style.display property to none hidden, blocks the display, and calls the function in the hyperlink to implement the effect as shown. The code is as follows:
<script language= "JavaScript" >
function Change (EL) {
 Whichel =  document.getElementById (EL)
If ( whichEl.style.display = = ' None '  ) { //block for display, none for hidden
 Whichel   .style.display = ' block ';
} else {
                Whichel.style.display = ' none ';
            }
return;
        }
</script>
<a href= "#" class= "one"Onclick=change ("Operate")> Uploading Courseware </a>
<tableid= "Operate"align=right border=0style= "Display:none">//Initial Hide
Also in hyperlinks I set the Style property to show different colors when I click or move to a hyperlink. <a class= "One" > can be implemented in hyperlinks. The code is as follows:
<style type= "Text/css" >
/ * This link changes color * /
A.one:link {color: #0000ff}
a.one:visited {color: #0000ff}
A.one:hover  {color: #ffcc00}
</style>
<a href=  "#"  class= "One"    Onclick=change ("Operate")> Uploading Courseware </a>
the display effect looks like this:

two. display PDF in HTML pageshowing the PDF is a hyperlink jump, which is also the method I described in the previous PHP value pass. The core code main_right3-3.php is as follows:
<TABLE cellspacing=0 cellpadding=2 width= "90%" align=right border=0><?php//Get Courseware Information $hgi=new HttpPostInf (); $result =$ Hgi->doquery (' 2 ', "SELECT * from courseware_pdf where cp_cid= '". $cid. "';"); $dj =json_decode ($result, true); $jcount =count ($DJ); for ($i =0; $i < $jcount; $i + +) {><tr height=10> <td ></TD></TR> <TR> <td width=40></TD> <TD> <a href=" main_right3-3-content.php?id=<?php echo $dj [$i] [' CP_PD Furl ']?> "class=" one "target=" Rightframe "><?php echo $dj [$i] [' cp_cwname '];? ></A> </TD> <TD></TD> </TR> <?php}?><tr height=20><td></td ></tr></table> 
inside the nested PHP code is connected to the database inside the data, where the database is built by Sina SAE, the PDF is stored in the URL, you can connect to the local address can also connect to the address on the cloud disk. As shown in the following:

where instantiated class new Httppostinf in httppost.php, mainly background communication processing. The code is as follows:
<? Phpheader ("content-type:text/html; Charset=utf-8 "), Class httppostinf{function __construct () {//parameterless constructor} function Doquery ($type, $sql) {//network communication function $da Ta = Array (' sqltype ' = = $type, ' sqlexe ' = $sql);  $data = Http_build_query ($data); $opts = Array (' http ' = = Array (' method ' = ' + ' POST ', ' header ' = ') ' content-type:application/x-www-form-urlencoded\ r\n "." Content-length: ". Strlen ($data). "\ r \ n", ' content ' = $data)); $context = Stream_context_create ($opts); $html = file_get_contents (' http://courseweb.sinaapp.com/courseweb.php ', False, $context); return $html;}}? 
The following code can be implemented to jump to main_right3-3-content.php display corresponding PHP, and pass the ID parameter integer you click on the PDF hyperlink corresponding to the database courseware URL address.
<a href= "main_right3-3-content.php?id=<?php echo $dj [$i] [' Cp_pdfurl ']?>"
 class= "one" target= "Rightframe" >
The following is the main_right3-3-content.php code display PDF, which is implemented through HTML5. 
<?phpheader ("content-type:text/html; Charset=utf-8 ");//include (" saestorage.class.php ");//echo $_get[' id '];? ><! DOCTYPE html>
is an example of a PDF showing our cloud disk:
You can display the online PDF effect as shown in the above code. 
The same local URL is src= "http://localhost:8080/CourseStudy/pdf/iCoot.pdf" to display, where the folder is the Apache path installed "F:\\xampp\htdocs\ Coursestudy\pdf ", where Coursestudy is the file name of my project. 
three. php upload PDF        PHP upload PDF code as follows, defined by the form attribute enctype=" Multipart/form-data ", at the same time uploaded to Action=" upload.php "The path to be processed, the submission method using the Post method. The selected file is the input definition type= "file". The main_right3-3.php code upload section is as follows: 
  
<form action= "upload.php" method= "post" enctype= "Multipart/form-data" ><table id= "operate" cellSpacing=0 Cellpadding=0 width= "80%" Align=right border=0 style= "Display:none" > <tr> <td colspan= "3" >and upload the file upload.php code as follows, mainly through the <input type= "file" Name= "MyFile" myfile corresponding to the uploaded file PDF properties, and determine whether it is a PDF file.
        BOOL Move_uploaded_file (string filename, string destination) uploads the file name filename to the specified path destination
in the code I uploaded the PDF folder to the project and named it at the current time, followed by the Insert Database Courseware table operation.
$_files[' myfile ' [' name '] refers to the name of the file being uploaded
$_files[' myfile ' [' type '] refers to the type of file being uploaded, at this time "application/pdf"
$_files[' myfile ' [' size '] refers to the size of the uploaded file, in bytes (B)
$_files[' myfile ' [' tmp_name '] means the file name of the temporary copy of the file being uploaded to the server, and the file is moved to the specified directory and the pro file is automatically destroyed. 
 Reference: http://blog.csdn.net/wer1234s/article/details/7845018
<?phpheader ("content-type:text/html; Charset=utf-8 "); include (".. /database/human.php "); include (".. /database/course.php "); Session_Start ($_post) {$file _name= $_files[' myfile ' [' name ']; $tmp _name = $_files[' MyFile ' [' tmp_name ']; if ($_files[' myfile ' [' type ']! = "Application/pdf") {echo "<p> please upload pdf file .</p>";} else {if (Is_uploaded_file ($tmp _name)) {//upload file $dest _dir= ' PDF ';//The path of the uploaded file $name= $dest _dir. '/'. Time (). PDF "; $time = time (); $result =move_uploaded_file ($tmp _name, $name); if ($result ==1) {echo" <p> successful upload </p> "; Path= "http://localhost:8080/CourseStudy/teacher/". $name;//echo $path;//Insert Data $sql = "INSERT INTO Courseware_pdf (cp_ Cno,cp_cid,cp_cwname,cp_pdfurl) "; $sql. =" VALUES (' ". $time." ', ' ". $_session[' CourseID ']." ', ' ". $_post[' Kjname ']." ', '. $path. '); "; echo $sql; $hgi =new httppostinf (); $result = $hgi->doquery (' 1 ', $sql); header (' location:main_right3-3.php ');}}  else {echo "<p> upload file failed </p>"; }}}?>
as shown, select PDF and upload the results of the run while the files are uploaded to the folder for the Apache path installed under the "F:\\xampp\htdocs\coursestudy\pdf" path. 


 finally hope that the article is helpful to you, because these knowledge are interlocking, so alone to talk about not easy to understand, I also try my best to write these articles, may be the article effect is not very good, there are many shortcomings. But please Haihan, still hope you can find the article to you useful knowledge! In the end, I wrote the 100th blog, two years to thank myself ~ look forward to longer
(By:eastmount late 2015-3-6 3 o'clock http://blog.csdn.net/eastmount/)






Php+javascript+html upload pdfs and browse PDF courseware