thulasipuppala
/
JSON-Lab-2
forked de Cohort4.2/JSON-Lab-2
Seguir 1
Destacar 0
Cuchillo 0
Código Incidencias 0 Peticiones pull 0 Lanzamientos 0 Wiki Activity
Explorar el Código

done

thulasi hace 7 años
padre
f2a7909189
commit
006e446eae
Se han modificado 2 ficheros con 56 adiciones y 2 borrados
Unificar vista Mostrar estadísticas de diff
  1. 35
    2
      index.html
  2. 21
    0
      jsonparse.js

+ 35
- 2
index.html Ver fichero

4 
     <meta charset="UTF-8">
 4 
     <meta charset="UTF-8">
5 
     <link href="./css/style.css" type="text/css" rel="stylesheet">
 5 
     <link href="./css/style.css" type="text/css" rel="stylesheet">
6 
     <title>Import Local JSON Data | Zipcode Wilmington</title>
 6 
     <title>Import Local JSON Data | Zipcode Wilmington</title>
7 
+    <!-- <script src = "jsonparse.js"></script> -->
7 
 </head>
 8 
 </head>
8 
 <body>
 9 
 <body>
9 
     <header class="main-header group">
 10 
     <header class="main-header group">
36
37
37 
     <section>
 38 
     <section>
38 
     	<h1>Movie Information</h1>
 39 
     	<h1>Movie Information</h1>
39 
-    	<div id="result"></div>
40 
+    	<div id="result">
41 
+      </div>
40 
     </section>
 42 
     </section>
43 
+    <script>
44 
+          var httpClient=function(){
45 
+            var xhr = new XMLHttpRequest();
46 
+          //  xhr.open('GET','https://data.sfgov.org/api/views/yitu-d5am/rows.json?accessType=DOWNLOAD');
47 
+
48 
+            xhr.onreadystatechange = function(){
49 
+            if((xhr.status===200) && (xhr.readyState===4)){
50 
+            var movies = JSON.parse(xhr.responseText);
51 
+            var output = "";
52 
+
53 
+            for(let i = 0; i < movies.data.length; i++){
54 
+            if(movies.data[i][10]=='Golden Gate Bridge'){
55 
+              output += "Movie Title: " + movies.data[i][8] + "<br/>"
56 
+                 + "Release Year: " + movies.data[i][9] + "<br/>"
57 
+                 + "Production Company: " + movies.data[i][12] + "<br/>"
58 
+                 + "<br/>";
59 
+            }
60 
+            }
61 
+            document.getElementById('result').innerHTML = output;
62 
+            }
63 
+
64 
+          }
65 
+          var url = 'https://data.sfgov.org/api/views/yitu-d5am/rows.json?accessType=DOWNLOAD';
66 
+          xhr.open("GET", url, true);
67 
+          xhr.setRequestHeader("Content-Type", "text/plain");
68 
+          xhr.send();
69 
+          return movies;
70 
+        }
71 
+        httpClient();
72 
+    </script>
41 
 </body>
 73 
 </body>
42 
-</html>
74 
+
75 
+</html>

+ 21
- 0
jsonparse.js Ver fichero

1 
+
2 
+      var xhr = new XMLHttpRequest();
3 
+      xhr.open('GET','https://data.sfgov.org/api/views/yitu-d5am/rows.json?accessType=DOWNLOAD');
4 
+
5 
+      xhr.onreadystatechange = function(){
6 
+      if((xhr.status===200) && (xhr.readyState===4)){
7 
+      var movies = JSON.parse(xhr.responseText);
8 
+      var output = "";
9 
+
10 
+      for(let i = 0; i < movies.data.length; i++){
11 
+      if(movies.data[i][10]=='Golden Gate Bridge'){
12 
+        output += "Movie Title: " + movies.data[i][8] + "<br/>"
13 
+           + "Release Year: " + movies.data[i][9] + "<br/>"
14 
+           + "Production Company: " + movies.data[i][12] + "<br/>"
15 
+           + "<br/>";
16 
+      }
17 
+      }
18 
+      document.getElementById('result').innerHTML = output;
19 
+      }
20 
+
21 
+      xhr.send();