finished

dishamodi0910 · Jun 15, 2024 · d75ca08 · d75ca08
1 parent c78e27d
commit d75ca08
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 8 deletions.
diff --git a/Existing_API_Collection/GlobalHolidayAPI/index.html b/Existing_API_Collection/GlobalHolidayAPI/index.html
@@ -12,6 +12,7 @@ <h1>Holiday List For Countries</h1>
     </header>
     <main>
         <div class="search-container">
+            <div>
             <label for="country-input">Select Country:</label>
             <select id="country-input">
                 <option value="IN">India</option>
@@ -31,8 +32,15 @@ <h1>Holiday List For Countries</h1>
                 <option value="JP">Japan</option>
                 <option value="LU">Luxembourg</option>
             </select>
+        </div>
+        <div>
+            <label>Select Year: </label>
+            <select id="year-input">
+
+            </select>
             <button id="search-button">Search Holidays</button>
         </div>
+        </div>
         <div id="holidays-list">
             <!-- Holidays will be displayed here -->
         </div>

diff --git a/Existing_API_Collection/GlobalHolidayAPI/script.js b/Existing_API_Collection/GlobalHolidayAPI/script.js
@@ -2,19 +2,25 @@ document.addEventListener("DOMContentLoaded", () => {
     const searchButton = document.getElementById("search-button");
     const countryInput = document.getElementById("country-input");
     const holidaysList = document.getElementById("holidays-list");
-
+    const Year_container=document.getElementById('year-input')
     searchButton.addEventListener("click", () => {
         const countryCode = countryInput.value;
-
-        if (countryCode) {
-            fetchHolidays(countryCode);
+        const Year=Year_container.value
+        if (countryCode && Year) {
+            fetchHolidays(countryCode,Year);
         }
     });
-
-    function fetchHolidays(countryCode) {
+    const year=new Date().getFullYear()
+    for(let i=year;i>=2010;i--){
+        const option=document.createElement('option')
+        option.setAttribute('value',i)
+        option.textContent='year: ' +i
+        Year_container.appendChild(option)
+    }
+    function fetchHolidays(countryCode,Year) {
         //API KEY
         const apiKey = 'akio9k5qVkY8dCwDGw657ZGC3M8LWOcY';
-        const apiUrl = `https://calendarific.com/api/v2/holidays?country=${countryCode}&year=2023&api_key=${apiKey}`;
+        const apiUrl = `https://calendarific.com/api/v2/holidays?country=${countryCode}&year=${Year}&api_key=${apiKey}`;
 
         fetch(apiUrl)
             .then(response => {

diff --git a/Existing_API_Collection/GlobalHolidayAPI/style.css b/Existing_API_Collection/GlobalHolidayAPI/style.css
@@ -27,7 +27,7 @@ label {
     font-size: 18px;
 }
 
-#country-input {
+#country-input ,#year-input{
     padding: 10px;
     margin: 10px 0;
     border: 1px solid #ccc;