fudansswebfundamental · yunlicangliu · Apr 10, 2019 · Apr 18, 2019 · Apr 22, 2019 · Apr 26, 2019
diff --git a/lab11/Lab11.php b/lab11/Lab11.php
@@ -3,8 +3,12 @@
 
 //****** Hint ******
 //connect database and fetch data here
-
-
+include 'functions.inc.php';
+$dbhost='localhost';
+$dbuser='root';
+$dbpass='15298526406zyff';
+$conn=mysqli_connect($dbhost,$dbuser,$dbpass);
+mysqli_select_db($conn,'travel');
 ?>
 
 <!DOCTYPE html>
@@ -37,6 +41,9 @@
         <div class="panel panel-default">
           <div class="panel-heading">Filters</div>
           <div class="panel-body">
+
+
+
             <form action="Lab11.php" method="get" class="form-horizontal">
               <div class="form-inline">
               <select name="continent" class="form-control">
@@ -46,7 +53,8 @@
 
                 //****** Hint ******
                 //display the list of continents
-
+                $sql='SELECT ContinentCode,ContinentName FROM Continents';
+                $result=mysqli_query($conn,$sql);
                 while($row = $result->fetch_assoc()) {
                   echo '<option value=' . $row['ContinentCode'] . '>' . $row['ContinentName'] . '</option>';
                 }
@@ -60,7 +68,13 @@
                 //Fill this place
 
                 //****** Hint ******
-                /* display list of countries */ 
+                /* display list of countries */
+                $sql1='SELECT Continent,CountryName FROM Countries';
+                $result1=mysqli_query($conn,$sql1);
+                while($row = $result1->fetch_assoc()) {
+                    echo '<option value=' . $row['Continent'] . '>' . $row['CountryName'] . '</option>';
+                }
+
                 ?>
               </select>    
               <input type="text"  placeholder="Search title" class="form-control" name=title>
@@ -69,29 +83,31 @@
             </form>
 
           </div>
-        </div>     
-
+        </div>
 
 		<ul class="caption-style-2">
             <?php 
             //Fill this place
 
             //****** Hint ******
-            /* use while loop to display images that meet requirements ... sample below ... replace ???? with field data
-            <li>
-              <a href="detail.php?id=????" class="img-responsive">
-                <img src="images/square-medium/????" alt="????">
-                <div class="caption">
-                  <div class="blur"></div>
-                  <div class="caption-text">
-                    <p>????</p>
-                  </div>
-                </div>
-              </a>
-            </li>        
-            */ 
+            /* use while loop to display images that meet requirements ... sample below ... replace ???? with field data            */
+
+            $continent1= isset($_GET["continent"])? $_GET["continent"] : '';
+            $continent2= isset($_GET["country"])? $_GET["country"] : '';
+            if ($continent1 || $continent2) {
+                $sql2="SELECT * FROM ImageDetails WHERE ContinentCode='$continent1' or ContinentCode='$continent2'";
+                $result2=mysqli_query($conn,$sql2);
+                findByContinent($result2);
+            }
+            else{
+                $sql3='SELECT * FROM ImageDetails';
+                $result3=mysqli_query($conn,$sql3);
+                findByContinent($result3);
+            }
+
+
             ?>
-       </ul>       
+       </ul>
 
 
     </main>

diff --git a/lab11/functions.inc.php b/lab11/functions.inc.php
@@ -1,5 +1,25 @@
 <?php
 
+function findByContinent($result){
+        while($row = $result->fetch_assoc()) {
+            $imgid = $row['ImageID'];
+            $path = $row['Path'];
+            $title = $row['Title'];
+            $continent = $row['ContinentCode'];
+            echo "<li>
+              <a href='detail.php?id=$imgid' class='img-responsive'>
+                <img src='images/square-medium/$path' alt='$continent' style='width: 225px;height: 225px'>
+                <div class='caption'>
+                  <div class='blur'></div>
+                  <div class='caption-text'>
+                    <h1>$title</h1>
+                  </div>
+                </div>
+              </a>
+            </li>";
+        }
+}
+
 function generateLink($url, $label, $class) {
    $link = '<a href="' . $url . '" class="' . $class . '">';
    $link .= $label;

diff --git a/lab4/lab4.css b/lab4/lab4.css
@@ -1,29 +1,91 @@
 
-h1 { font-size: 3em; font-weight: bold; margin-top: 0;}
+span1 { font-size: 3em;
+        font-weight: bold;
+        margin-top: 0;
+        display: inline;
+}
 
 div#topHeaderRow {
-   font-size: 0.9em;
+    font-size: 0.9em;
+}
+
+nav li{
+    display: inline-block;
+}
+
+#logo{
+   margin-right: 100px;
+    color: silver;
+}
+
+
+header{
+    margin-left: 80px;
+    margin-right: 80px;
 }
 
-.price { 
+section{
+    margin-left: 80px;
+    margin-right: 80px;
+}
 
+#mainNavigationRow{
+    font-size: large;
 }
 
-.similarTitle {  }
+.price {
+    color: red;
+    font-weight: bold;
+    font-size: 1.5em;
+
+}
+
+.similarTitle {
+
+}
 
 .cartText { 
 
 }
 
+
+
+
+
 footer {
    margin-top: 1em;
    background-color: #E7E7E7;
+    padding-bottom: 0;
+}
 
+.list-group li{
+    list-style: none;
+    margin: 20px;
+}
+.container1{
+    padding-left: 80px;
+    padding-right: 80px;
 }
 
+
+
 .tight-form-group {  }
 
-#copyrightRow { 
-    background-color: #3A3A3A; 
+#copyrightRow {
+
+    background-color: #3A3A3A;
+    color: silver;
+    margin-top:15px;
+    padding: 1px;
+}
+
+#copyrightRow p{
+    margin-left: 100px;
+    margin-top: 3px;
+}
+
+#copyrightRow span{
+    float: right;
+    margin-right: 50px;
+}
 
-}