Update app.py

app.py

@@ -451,9 +451,6 @@ async def process_single_dog(image):
 
 
 
-import gradio as gr
-from PIL import Image, ImageDraw, ImageFont
-
 async def predict(image):
     if image is None:
         return "Please upload an image to start.", None, gr.update(visible=False, choices=[]), None
@@ -516,24 +513,23 @@ async def predict(image):
         {dogs_info}
         
         <script>
-        // 這段代碼用來附加每個 Learn More 按鈕的事件監聽器
-        document.querySelectorAll('button[id^="Dog"]').forEach(button => {{
-            button.addEventListener('click', () => {{
+        document.querySelectorAll('button[id^="Dog"]').forEach(button => {
+            console.log('Attaching event to button: ' + button.id);  // 檢查每個按鈕是否正確被生成
+            button.addEventListener('click', () => {
                 const button_id = button.id;
+                console.log('Button clicked: ' + button_id);  // 檢查是否觸發了按鈕點擊事件
                 const radio = document.querySelector('input[type=radio][value="' + button_id + '"]');
-                console.log('Button clicked: ' + button_id);  // 檢查按鈕是否被觸發
-                if (radio) {{
-                    radio.click();  // 觸發點擊事件
-                }} else {{
-                    console.error("Radio button not found:", button_id);  // 如果找不到相應的 radio button
-                }}
-            }});
-        }});
+                if (radio) {
+                    radio.click();
+                    console.log('Radio button clicked for: ' + button_id);  // 檢查是否找到相應的 radio button 並點擊
+                } else {
+                    console.error("Radio button not found for: " + button_id);  // 如果沒有找到 radio，顯示錯誤
+                }
+            });
+        });
         </script>
         """
 
-
-
         initial_state = {
             "dogs_info": dogs_info,
             "buttons": buttons,