Update app.py

app.py

@@ -122,11 +122,47 @@ def main(audio):
     # Convert DataFrame to HTML table with editable text boxes
     table_html = df.to_html(index=False, escape=False, formatters={"Answer": lambda x: f'<input type="text" value="{x}" />'})
     
-    return table_html
+    # Add JavaScript to capture changes and submit
+    custom_js = """
+    <script>
+    function getTableData() {
+        var table = document.querySelector('table');
+        var data = [];
+        for (var i = 1, row; row = table.rows[i]; i++) {
+            var question = row.cells[0].innerText;
+            var answer = row.cells[1].querySelector('input').value;
+            data.push({question: question, answer: answer});
+        }
+        return data;
+    }
+
+    function submitTableData() {
+        var data = getTableData();
+        fetch('/submit_table_data', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(data),
+        })
+        .then(response => response.json())
+        .then(data => {
+            document.querySelector('#submit_status').innerText = 'Data submitted successfully!';
+        })
+        .catch((error) => {
+            console.error('Error:', error);
+        });
+    }
+
+    document.querySelector('#submit_button').addEventListener('click', submitTableData);
+    </script>
+    """
+    
+    return table_html + custom_js
 
 # Function to handle submit button and store table data in dictionary
-def submit_table_data(answers):
-    tabledata = dict(zip(oral_health_assessment_form, answers))
+def submit_table_data(data):
+    tabledata = {item['question']: item['answer'] for item in data}
     print("Submitted Table Data: ", tabledata)
     return f"Data submitted successfully! {tabledata}"
 
@@ -139,12 +175,11 @@ with gr.Blocks() as demo:
             output_html = gr.HTML(label="Assessment Form")
         with gr.Column():
             transcribe_button = gr.Button("Transcribe and Generate Form")
-            submit_button = gr.Button("Submit")
+            submit_button = gr.Button("Submit", elem_id="submit_button")
+            submit_status = gr.Textbox(label="Submit Status", elem_id="submit_status")
 
-    output_textboxes = [gr.Textbox(label=question) for question in oral_health_assessment_form]
-    
     transcribe_button.click(fn=main, inputs=audio_input, outputs=output_html)
-    submit_button.click(fn=submit_table_data, inputs=output_textboxes, outputs=gr.Textbox(label="Submit Status"))
+    demo.add_event_listener('submit_table_data', fn=submit_table_data, inputs=None, outputs=submit_status)
 
 # Launch the app
 demo.launch()