Add loading spinner to report table
This commit is contained in:
		
							parent
							
								
									13ba704824
								
							
						
					
					
						commit
						e1873fe4ae
					
				
					 2 changed files with 13 additions and 5 deletions
				
			
		|  | @ -45,6 +45,9 @@ | ||||||
|                         <h3>Your Report History</h3> |                         <h3>Your Report History</h3> | ||||||
|                     </div> |                     </div> | ||||||
|                     <div class="card-body"> |                     <div class="card-body"> | ||||||
|  |                         <div class="text-center"> | ||||||
|  |                             <i class="fas fa-spinner fa-3x fa-spin"></i> | ||||||
|  |                         </div> | ||||||
|                         <table class="table table-striped table-responsive-sm" style="visibility:hidden"> |                         <table class="table table-striped table-responsive-sm" style="visibility:hidden"> | ||||||
|                             <thead> |                             <thead> | ||||||
|                                 <tr> |                                 <tr> | ||||||
|  |  | ||||||
|  | @ -290,14 +290,19 @@ function createReportForm(parsedData, type) { | ||||||
| 
 | 
 | ||||||
| function displayListOfReports(parsedData) { | function displayListOfReports(parsedData) { | ||||||
|     const reports = parsedData.reports; |     const reports = parsedData.reports; | ||||||
|  |     const cardBody = document.querySelector(".card-body"); | ||||||
|     const table = document.querySelector("table"); |     const table = document.querySelector("table"); | ||||||
| 
 | 
 | ||||||
|  |     console.log(cardBody); | ||||||
|  |     console.log(cardBody.firstElementChild); | ||||||
|  |     cardBody.removeChild(cardBody.firstElementChild); // remove loading spinner
 | ||||||
|  |      | ||||||
|     if (reports.length === 0) { |     if (reports.length === 0) { | ||||||
|         const cardBody = document.querySelector(".card-body"); |         cardBody.removeChild(table); | ||||||
|         const h4 = document.createElement("h4"); |         const h5 = document.createElement("h5"); | ||||||
|         h4.innerHTML = "No reports found."; |         h5.innerHTML = "No reports found."; | ||||||
|         h4.classList.add("text-center"); |         h5.classList.add("text-center"); | ||||||
|         cardBody.insertBefore(h4, table); |         cardBody.appendChild(h5); | ||||||
|     } else { |     } else { | ||||||
|         const tbody = document.querySelector("tbody"); |         const tbody = document.querySelector("tbody"); | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		
		Reference in a new issue
	
	 Preston Doman
						Preston Doman