Work on the AJAX calls for Project 4

czenzel · Feb 17, 2024 · 2f47472 · 2f47472
1 parent 882e984
commit 2f47472
Show file tree

Hide file tree

Showing 7 changed files with 18 additions and 4 deletions.
diff --git a/project1/src/Bootstrap/Theme.php b/project1/src/Bootstrap/Theme.php
@@ -14,7 +14,7 @@ public function header()
         <!DOCTYPE html>
         <html>
             <head>
-                <title>Project 1</title>
+                <title>Project</title>
             </head>
             <body>
         EOL;

diff --git a/project2/src/Bootstrap/Theme.php b/project2/src/Bootstrap/Theme.php
@@ -14,7 +14,7 @@ public function header()
         <!DOCTYPE html>
         <html>
             <head>
-                <title>Project 1</title>
+                <title>Project</title>
             </head>
             <body>
         EOL;
@@ -25,6 +25,7 @@ public function header()
     public function scripts_body() 
     {
         $scripts = <<<EOL
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
         <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
         <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
         EOL;

diff --git a/project3/css/styles.css b/project3/css/styles.css
@@ -2,3 +2,8 @@ main
 {
     margin-top: 25px;
 }
+
+.alert-api
+{
+    display: none;
+}
diff --git a/project3/index.php b/project3/index.php
@@ -19,6 +19,10 @@
             <div class="container">
                 <div class="row">
                     <div class="col-md-12">
+                        <div class="alert alert-danger alert-api" role="alert">
+                            <h4 class="alert-heading">Warning</h4>
+                            <p>You have entered an invalid VIN number that was previouslly recgonized. In a perfect production application you would get the exact exception and show it here.</p>
+                        </div>
                         <div id="vehicles">
                         <?php
                         $table->render();

diff --git a/project3/js/forms.php b/project3/js/forms.php
@@ -24,7 +24,10 @@ function load_ajax_submission() {
         url: "/ajax.php",
         data: formData
       }).done(function (data) {
+        $('.alert-api').hide();
         $('#vehicles').html(data);
+      }).fail(function (jqXHR, textStatus, errorThrown) {
+        $('.alert-api').show();
       });
 
       event.preventDefault();

diff --git a/project3/src/Bootstrap/Theme.php b/project3/src/Bootstrap/Theme.php
@@ -14,7 +14,7 @@ public function header()
         <!DOCTYPE html>
         <html>
             <head>
-                <title>Project 1</title>
+                <title>Project</title>
             </head>
             <body>
         EOL;

diff --git a/project4/src/Bootstrap/Theme.php b/project4/src/Bootstrap/Theme.php
@@ -14,7 +14,7 @@ public function header()
         <!DOCTYPE html>
         <html>
             <head>
-                <title>Project 1</title>
+                <title>Project</title>
             </head>
             <body>
         EOL;
@@ -25,6 +25,7 @@ public function header()
     public function scripts_body() 
     {
         $scripts = <<<EOL
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
         <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
         <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
         EOL;