Update app.py

app.py

@@ -752,7 +752,19 @@ def enhanced_likert_scale(question_data):
     st.markdown(f"<div style='text-align:center; font-weight:bold; margin-bottom:15px;'>{question}</div>", 
                 unsafe_allow_html=True)
 
-    # ایجاد خط و نقاط با HTML/CSS
+    # ایجاد سلکت باکس برای انتخاب گزینه‌ها
+    selected_value = st.selectbox(
+        "لطفاً یک گزینه را انتخاب کنید:",
+        options=range(1, scale+1),  # گزینه‌ها از 1 تا scale
+        index=st.session_state.get(key) - 1 if st.session_state.get(key) else 0,  # پیش‌فرض انتخاب شده
+        key=f"select_{key}",
+        format_func=lambda x: labels[x-1]  # برچسب‌ها برای هر گزینه
+    )
+
+    # ذخیره انتخاب کاربر
+    st.session_state[key] = selected_value
+
+    # نمایش خط و دکمه‌ها با HTML/CSS
     scale_html = f"""
     <style>
         .likert-line {{
@@ -810,57 +822,23 @@ def enhanced_likert_scale(question_data):
             }}
         }}
     </style>
-    
-    <div class='likert-container'>
-        <div class='likert-labels'>
-            <span>{labels[1]}</span>
-            <span>{labels[0]}</span>
-        </div>
-        <div class='likert-line'>
     """
 
-    # اضافه کردن نقاط
-    for i in range(scale):
-        value = scale - i
-        is_selected = st.session_state.get(key) == value
-        scale_html += f"<div class='likert-dot {'selected' if is_selected else ''}' onclick='setLikertValue({value})'></div>"
-    
-    scale_html += "</div>"
-    
     # نمایش مقدار انتخاب شده
     if st.session_state.get(key):
-        scale_html += f"<div class='likert-value'>پاسخ شما: {st.session_state[key]}</div>"
+        scale_html += f"<div class='likert-value'>پاسخ شما: {labels[st.session_state[key] - 1]}</div>"
     
     scale_html += "</div>"
-    
-    # تزریق JavaScript برای مدیریت کلیک
-    components.html(scale_html + """
-    <script>
-    function setLikertValue(value) {
-        const streamlitDoc = window.parent.document;
-        const buttons = streamlitDoc.querySelectorAll('button[data-testid="stButton"]'); // جستجوی دکمه‌ها در DOM
-        buttons.forEach(btn => {
-            if (btn.textContent.trim() === String(value)) {
-                btn.click();  // کلیک روی دکمه مورد نظر برای انتخاب مقدار
-            }
-        });
-    }
-    </script>
-    """, height=80)
-
-    # دکمه‌های واقعی (مخفی و کوچک)
-    btn_cols = st.columns(scale)
-    for i in range(scale):
-        with btn_cols[i]:
-            value = scale - i
-            if st.button(
-                str(value),
-                key=f"{key}_btn_{value}",
-                type="primary" if st.session_state.get(key) == value else "secondary",
-                help="این دکمه‌ها مخفی هستند"  # پیام راهنما
-            ):
-                st.session_state[key] = value
-                st.rerun()
+
+    # تزریق HTML/CSS برای خط و نقاط
+    components.html(scale_html, height=80)
+
+    # دکمه ارسال (پررنگ و فعال)
+    button_label = "ثبت پاسخ"
+    if st.session_state.get(key) is not None:
+        st.button(button_label, use_container_width=True, key=f"submit_{key}", type="primary")
+    else:
+        st.button(button_label, use_container_width=True, key=f"submit_{key}", type="secondary")
 
     return st.session_state.get(key)