Finally extracting questions from the survey. Additional table added to hold questions

2025-05-31 00:16:39 +01:00
parent 437e1afede
commit dc68e98d92
7 changed files with 213 additions and 122 deletions
--- a/get_qid_counts.html
+++ b/get_qid_counts.html
@@ -1,67 +1,58 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<meta charset="UTF-8" />
-<meta name="viewport" content="width=device-width, initial-scale=1" />
-<title>QID Value Counts</title>
-<style>
-  body { font-family: Arial, sans-serif; margin: 2em; }
-  label, input, button { font-size: 1em; margin: 0.5em 0; }
-  ul { list-style-type: none; padding-left: 0; }
-  li { padding: 0.3em 0; }
-  .error { color: red; }
-</style>
+  <meta charset="UTF-8" />
+  <title>Form Submit Example</title>
+  <style>
+    textarea {
+      width: 100%;
+      height: 200px;
+      margin-top: 1em;
+    }
+  </style>
 </head>
 <body>

-<h1>Query Value Counts by QID</h1>
+  <form id="qidForm">
+    <label for="qidInput">Enter QID:</label>
+    <input type="text" id="qidInput" name="qid" required /><br />

-<form id="qidForm">
-  <label for="qidInput">Enter QID:</label><br />
-  <input type="text" id="qidInput" name="qid" required />
-  <button type="submit">Get Counts</button>
-</form>
+    <label for="survey">Survey: (SV_cwKjMqAqGxImjMG)</label>
+    <input type="text" id="survey" name="survey" required /><br />

-<div id="results"></div>
+    <label for="Q1">Enter Q1:</label>
+    <input type="text" id="Q1" name="Q1" /><br />

-<script>
-document.getElementById('qidForm').addEventListener('submit', function(e) {
-  e.preventDefault();
-  const qid = document.getElementById('qidInput').value.trim();
-  const resultsDiv = document.getElementById('results');
-  resultsDiv.innerHTML = 'Loading...';
+    <label for="Q2">Enter Q2:</label>
+    <input type="text" id="Q2" name="Q2" /><br />

-  fetch('get_qid_counts.php', {
-    method: 'POST',
-    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
-    body: new URLSearchParams({qid})
-  })
-  .then(response => response.json())
-  .then(data => {
-    if (data.error) {
-      resultsDiv.innerHTML = `<p class="error">${data.error}</p>`;
-      return;
-    }
+    <label for="Q3">Enter Q3:</label>
+    <input type="text" id="Q3" name="Q3" /><br />

-    if (!Array.isArray(data) || data.length === 0) {
-      resultsDiv.innerHTML = '<p>No data found.</p>';
-      return;
-    }
+    <button type="submit">Get Counts</button>
+  </form>

-    let html = '<h2>Value Counts for ' + qid + '</h2><ul>';
-    data.forEach(item => {
-      html += `<li><strong>Value ${item.value}:</strong> ${item.count}</li>`;
+  <textarea id="output" readonly placeholder="Results will appear here..."></textarea>
+
+  <script>
+    document.getElementById('qidForm').addEventListener('submit', async function (e) {
+      e.preventDefault();
+
+      const formData = new FormData(this);
+
+      try {
+        const response = await fetch('get_qid_counts.php', {
+          method: 'POST',
+          body: formData
+        });
+
+        const text = await response.text();
+        document.getElementById('output').value = text;
+      } catch (error) {
+        document.getElementById('output').value = 'Error: ' + error.message;
+      }
    });
-    html += '</ul>';
-
-    resultsDiv.innerHTML = html;
-  })
-  .catch(err => {
-    resultsDiv.innerHTML = `<p class="error">Error: ${err.message}</p>`;
-  });
-});
-</script>
+  </script>

 </body>
 </html>
-