मैं रेल में AJAX-y सशर्त शो/छुपा फॉर्म फ़ील्ड कैसे कर सकता हूं?

Question

मैं फॉर्म में एक चुनिंदा क्षेत्र की स्थिति के आधार पर रेल में किसी रूप में कुछ फ़ील्ड दिखाना या छिपाना चाहता हूं। मुझे (वर्तमान में) फ़ील्ड के लिए दूसरे डेटाबेस लुकअप की आवश्यकता नहीं है, इसलिए मैं इसे सभी दृश्यों तक सीमित रखने की कोशिश कर रहा हूं। मेरे पास रूपरेखा है, लेकिन मुझे कार्यान्वयन के विवरण में कुछ परेशानी हो रही है।

मेरा प्रारंभिक विचार observe_field का उपयोग करना था और एलिमेंट.शो इत्यादि आदि का उपयोग करना था, लेकिन फिर मुझे एक जावास्क्रिप्ट सशर्त लिखना होगा। इसे शायद काम करना होगा, लेकिन अगर मैं कर सकता हूं तो मैं इससे बचना चाहता हूं।

एक अन्य दृष्टिकोण फ़ील्ड डालने के लिए आरजेएस टेम्पलेट का अनुरोध करने के लिए observe_field और replace_html का उपयोग करना होगा। बुरा नहीं है, लेकिन चूंकि मैं form_for ब्लॉक का उपयोग कर रहा हूं, इसलिए मुझे इसे सही करने के लिए आरजेएस टेम्पलेट के माध्यम से फ़ॉर्म इंस्टेंस को सभी तरह से पास करना होगा।

मैं प्रत्येक पास पर रिकॉर्ड भी अपडेट कर सकता हूं, और नई स्थितियों के तहत फॉर्म प्रदर्शित कर सकता हूं, लेकिन यही वह है जिसे मैं टालने की कोशिश कर रहा हूं। यह सब कुछ देखने के लिए इतना आसान होगा।

मुझे यहां क्या याद आ रही है? रेल में सशर्त शो/छुपा फॉर्म के लिए स्वीकार्य अभ्यास क्या है?

Answer 1

रेल डेवलपर के रूप में, मैं अविभाज्य जावास्क्रिप्ट के सिद्धांतों का पालन करने का सुझाव देता हूं। जब रेल की बात आती है, तो इसका आमतौर पर क्या मतलब है कि आपको अपनी सभी कार्यक्षमताओं को संभालने के लिए केवल एक बड़ा दृश्य नहीं लिखना चाहिए। यह आपके एचटीएमएल व्यू को विकसित और बनाए रखने में आसान बनाता है, इससे आपके व्यवहार को बनाए रखना आसान हो जाता है, और यह आम तौर पर आपके आवेदन को ठीक करने की बेहतर समझ लेता है। उस हद तक, मैं रेलवे जावास्क्रिप्ट हेल्पर्स से हर कीमत पर बचता हूं।

मैं जो करता हूं वह आपके व्यवहार को एक जावास्क्रिप्ट फ़ाइल में विभाजित करता है जिसे आप स्वयं कोड करते हैं। Jquery जैसे लाइब्रेरी का उपयोग करना (इस तरह की चीज़ के लिए मेरा पसंदीदा लोप्रो है, लेकिन मैं अपने तरीकों से थोड़ा सेट होने के लिए स्वीकार करने वाला पहला व्यक्ति होगा), एक विशिष्ट हैंडलर को विशिष्ट तत्वों (या एक बार में तत्वों की एक पूरी कक्षा)।

एक चयन बॉक्स के लिए, जब उपयोगकर्ता चयन को बदलता है तो ऑन चेंज हैंडलर निकाल दिया जाएगा। तत्व पर selectedIndex संपत्ति आपको बताएगी कि कौन सा विकल्प चुना गया है, और options सरणी आपको संबंधित विकल्प को देखने देगी। तो, अपने हैंडलर में आप निम्नलिखित (प्रोटोटाइप का प्रयोग करके) की तरह कुछ कर सकता है:

<%= link_to_function(check_box_tag "model[attribute_name]") do |page| 
    page.toggle :model_attribute_name 
end-%> 

<span style="display:none;" id="model_attribute_name"> 
<%= f.text_area :other_conditional_attribute -%> 
</span> 

या

<%= link_to_function "Conditional Item", :class => "your-style-class" do |page| 
    page.insert_html :bottom, :other_conditional_attribute, :partial => 'conditional_attribute_partial', :object => Object.new, :locals => {:local_variable => local_variable} 
end-%> 

:

function(e) { 
    var element = Event.element(e) 
    var index = element.selectedIndex 
    var option = element.options[index] 

    if(option.value == "Show fields") 
    $('hidden-fields').show() 
    else 
    $('hidden-fields').hide() 
} 

Answer 2

मैं एक ही बात कुछ भिन्न तरीकों को संभालने आरजेएस सामान/प्रोटोटाइप सहायक भयानक हैं।
Rails API: PrototypeHelpers
Rails API: JavascriptHelpers

Answer 3

मैं की तर्ज पर एक सरल JQuery समारोह का उपयोग कर सुझाव है:

$('a#slick-show').click(function() { 
    $('#slickbox').show('slow'); 
    return false; 
    }); 

Jquery में दिखाएँ/छिपाएँ की मूल बातें के लिए, वहाँ एक ट्यूटोरियल here है।