JS Changed

codezilla2018 · May 22, 2018 · f957c1f · f957c1f
1 parent ca8d8ca
commit f957c1f
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 6 deletions.
diff --git a/Bussiness-Card-Maker/index.html b/Bussiness-Card-Maker/index.html
@@ -7,6 +7,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
     <title>Business Card Generator | CodeZilla 2018</title>
 
+    <!--JQuery-->
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+
     <!-- Page styles -->
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en">
     <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
@@ -98,28 +101,28 @@
               <form>
                 <fieldset class="uk-fieldset">
                   <div class="uk-margin">
-                    <input class="uk-input" type="text" placeholder="Name">
+                    <input id="txt-name" name="name" class="uk-input" type="text" placeholder="Name">
                   </div>
 
                   <div class="uk-margin">
-                    <input class="uk-input" type="text" placeholder="Job Title">
+                    <input id="txt-job-title" name="job-title" class="uk-input" type="text" placeholder="Job Title">
                   </div>
 
                   <div class="uk-margin">
-                    <textarea class = "uk-textarea" rows = "5" placeholder="Address"></textarea>
+                    <textarea id="txt-address" name="address" class = "uk-textarea" rows = "5" placeholder="Address"></textarea>
                   </div>
 
                   <div class="uk-margin">
-                    <input class="uk-input" type="text" placeholder="Telephone">
+                    <input id="txt-telephone" name="telephone" class="uk-input" type="text" placeholder="Telephone">
                   </div>
 
                   <div class="uk-margin">
-                    <input class="uk-input" type="text" placeholder="Email Address">
+                    <input id="txt-email" name="email" class="uk-input" type="text" placeholder="Email Address">
                   </div>
 
                   <div class="uk-margin" style="float: right">
                     <button id="btn-generate" class="uk-button uk-button-primary">Generate</button>
-                    <button id="btn-clear-all" class="uk-button uk-button-secondary">Clear All</button>
+                    <button id="btn-clear-all" class="uk-button uk-button-secondary" onclick="clearAll()">Clear All</button>
                   </div>
 
                 </fieldset>

diff --git a/Bussiness-Card-Maker/js/index.js b/Bussiness-Card-Maker/js/index.js
@@ -6,3 +6,10 @@
  *
  * **/
 
+function clearAll() {
+    $('#txt-name').val('');
+    $('#txt-job-title').val('');
+    $('#txt-address').val('');
+    $('#txt-telephone').val('');
+    $('#txt-email').val();
+}