|
<!DOCTYPE html> |
|
<html lang="en"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>Upload JSON</title> |
|
<script> |
|
function showMessage(message) { |
|
var messageDiv = document.getElementById('message'); |
|
messageDiv.innerText = message; |
|
messageDiv.style.display = 'block'; |
|
} |
|
|
|
function handleFormSubmit(event) { |
|
event.preventDefault(); |
|
var formData = new FormData(event.target); |
|
|
|
fetch('/upload_json', { |
|
method: 'POST', |
|
body: formData |
|
}) |
|
.then(response => response.json()) |
|
.then(data => { |
|
if (data.message) { |
|
showMessage(data.message); |
|
} else if (data.error) { |
|
showMessage(data.error); |
|
} |
|
}) |
|
.catch(error => { |
|
showMessage("An error occurred: " + error); |
|
}); |
|
} |
|
</script> |
|
</head> |
|
<body> |
|
<h1>Upload JSON File</h1> |
|
<form id="uploadForm" onsubmit="handleFormSubmit(event)" enctype="multipart/form-data"> |
|
<label for="file">Select JSON file:</label> |
|
<input type="file" id="file" name="file" accept=".json" required><br><br> |
|
<input type="submit" value="Upload"> |
|
</form> |
|
<div id="message" style="display:none; margin-top:20px;"></div> |
|
</body> |
|
</html> |
|
|
