Update app.py

app.py

@@ -739,7 +739,7 @@ h3 {
 
 # ========== توابع اصلی ==========
 def custom_likert_slider(question_data):
-    """Custom Likert-style question that correctly captures user selection"""
+    """Custom Likert-style question with circles and labels"""
     question = question_data["question"]
     key = question_data["key"]
     scale = question_data["scale"]
@@ -748,56 +748,45 @@ def custom_likert_slider(question_data):
     # مقدار پیش‌فرض از session_state یا وسط مقیاس
     default_value = st.session_state.get(key, (scale + 1) // 2)
     
-    # مقدار انتخاب شده کاربر (اگر وجود دارد)
-    selected_value = st.session_state.get(f"selected_{key}", default_value)
+    # ایجاد رادیو باتن‌ها با حلقه (بدون بک‌اسلش در f-string)
+    radio_buttons = "".join([
+        f'<input type="radio" id="radio_{key}_{i}" name="{key}" value="{i}" '
+        f'style="width: 30px; height: 30px;" '
+        f'{"checked" if st.session_state.get(key, default_value) == i else ""} '
+        f'onclick="updateSlider({i}, \'{key}\')">'
+        for i in range(1, scale + 1)
+    ])
     
-    # HTML و JavaScript برای کامپوننت سفارشی
     html = f"""
     <div style="direction: ltr; font-family: 'B Nazanin'; margin-bottom: 30px;">
         <label style="font-size: 16px; font-weight: bold; display: block; text-align: center;">{question}</label>
         <div style="display: flex; justify-content: center; align-items: center; gap: 10px; margin: 10px 0;">
             <span>{labels[0]}</span>
             <div style="display: flex; gap: 10px;">
-                {"".join([
-                    f'<input type="radio" id="radio_{key}_{i}" name="{key}" value="{i}" style="width: 30px; height: 30px;" '
-                    f'{"checked" if selected_value == i else ""} '
-                    f'onclick="updateSelection({i}, \'{key}\')">'
-                    for i in range(1, scale + 1)
-                ])}
+                {radio_buttons}
             </div>
             <span>{labels[1]}</span>
         </div>
-        <p id="display_{key}" style='text-align:center; color:#6a0dad; font-weight:bold;'>
-            پاسخ شما: {selected_value}
+        <p id="selected_value_{key}" style="text-align:center; color:#6a0dad; font-weight:bold;">
+            پاسخ شما: {st.session_state.get(key, default_value)}
         </p>
     </div>
 
     <script>
-    function updateSelection(value, key) {{
-        // نمایش مقدار انتخاب شده
-        document.getElementById("display_" + key).innerHTML = "پاسخ شما: " + value;
+    function updateSlider(value, key) {{
+        document.getElementById("selected_value_" + key).innerHTML = "پاسخ شما: " + value;
         
-        // ارسال مقدار به Streamlit
         window.parent.postMessage({{
             type: 'streamlit:setComponentValue',
             key: key,
             value: value
         }}, '*');
-        
-        // ذخیره در session
-        window.parent.postMessage({{
-            type: 'streamlit:setSessionState',
-            key: "selected_" + key,
-            value: value
-        }}, '*');
     }}
     </script>
     """
     
     components.html(html, height=200)
-    
-    # بازگرداندن مقدار انتخاب شده کاربر
-    return selected_value
+    return st.session_state.get(key, default_value)
     
 def create_ride_map():
     """ایجاد نقشه سفر با Folium - نسخه اصلاح شده با مناطق عمومی"""