2020-1-capstone-design1 / Triz_Project1

Go to a project
Toggle navigation Toggle navigation pinning
minsung
1cefc498 1 parent 9f3ad802

pratice fetch api and make ajax form using ajax

Inline Side-by-side
Showing 4 changed files with 60 additions and 11 deletions
...@@ -37,3 +37,14 @@ function checkValidation(self){ ...@@ -37,3 +37,14 @@ function checkValidation(self){
37 }else return false; 37 }else return false;
38 38
39 } 39 }
40 +
41 +function ajaxvalidation(self){
42 + $(document).ready(function(){
43 + var email=document.querySelector('#evalidation');
44 + var fpassword=document.querySelector('#evalidation');
45 +
46 + })
47 +
48 +
49 +
50 +}
......
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 - 3 +<script src="../fetch-master/fetch.js"></script>
4 <body> 4 <body>
5 <input type="button" value="fetch" onclick=" 5 <input type="button" value="fetch" onclick="
6 - /* 6 +
7 fetch('css').then(function(response){ 7 fetch('css').then(function(response){
8 response.text().then(function(text){ 8 response.text().then(function(text){
9 alert(text); 9 alert(text);
10 }) 10 })
11 - }) 11 + });
12 - */
13 - function callbackme(){
14 - console.log('response end');
15 - }
16 - fetch('html').then(callbackme); //
17 - console.log(1);
18 - console.log(2);
19 "> 12 ">
20 </body> 13 </body>
21 </html> 14 </html>
......
1 +<!doctype html>
2 +<html>
3 +<head>
4 + <title>WEB1 - Welcome</title>
5 + <meta charset="utf-8">
6 + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
7 + <script src="colors.js"></script>
8 + <script src="../fetch-master/fetch.js"></script>
9 +</head>
10 +<body>
11 + <h1><a href="#!welcome">WEB</a></h1>
12 + <h1><a href="index.html">WEB</a></h1>
13 + <h2><a href="welcome.html">Welcome</h2>
14 + <input id="night_day" type="button" value="night" onclick="
15 + nightDayHandler(this);
16 + ">
17 + <ol id="nav">
18 +
19 + </ol>
20 + <article>
21 + </article>
22 + <script>
23 + function fetchPage(name){
24 + fetch(name).then(function(response){
25 + response.text().then(function(text){
26 + document.querySelector('article').innerHTML=text;
27 + })
28 + });
29 + }
30 +
31 + if(location.hash){
32 + fetchPage(location.hash.substr(2));
33 + }else{
34 + fetchPage('welcome');
35 + }
36 + fetch('list').then(function(response){
37 + response.text().then(function(text){
38 + document.querySelector('#nav').innerHTML=text;
39 + })
40 + });
41 +
42 + </script>
43 +</body>
44 +</html>
...@@ -5,7 +5,8 @@ ...@@ -5,7 +5,8 @@
5 <meta charset="utf-8"> 5 <meta charset="utf-8">
6 <link rel="stylesheet" href="style/style.css"> 6 <link rel="stylesheet" href="style/style.css">
7 <script src="JS/validation.js"></script> 7 <script src="JS/validation.js"></script>
8 - 8 +<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
9 +</script>
9 </head> 10 </head>
10 <body> 11 <body>
11 12
......