रेल में एक div के साथ date_select के हर चयन को कैसे लपेटें?

Question

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

मेरे रूपों में प्रत्येक चयन के लिए मैं इसे चारों ओर एक div लपेटता हूं, इसे स्टाइल करने के लिए, जो आमतौर पर ठीक काम करता है। date_select के साथ समस्या यह है कि यह तीन चयन बॉक्स उत्पन्न करता है जो सभी एक div में लपेटा जाता है। Haml में उदाहरण के रूप में क्षेत्र के लिए कोड इस तरह दिखता है:

.select-wrapper 
    = f.date_select :birthday, :start_year => Time.now.year - 120, :end_year => Time.now.year 

.select_wrapper तीनों का चयन करें बॉक्स के चारों ओर एक div बनाता है, लेकिन मैं हर सलेक्ट बॉक्स की जरूरत है यह खुद आवरण है है। क्या इस मुद्दे को हल करने का कोई तरीका है?

किसी भी मदद की सराहना की जाएगी। धन्यवाद।

Answer 1

विधि 1 (मुश्किल)

अवहेलना date_select कोड आप के लिए इस विशेष उदाहरण को संभालने के लिए: https://github.com/rails/rails/blob/master/actionview/lib/action_view/helpers/date_helper.rb#L283

विधि 2 (आसान)

उपयोग jQuery:

// Find all select boxes that have an ID attribute containing "birthday" 
// and wrap a div tag around them with a certain class 
$('select[id*="birthday"]').wrapAll('<div class="select_wrapper">'); 

Answer 2

मैं एक समाधान का उपयोग कर रहा हूँ पैरामीटर :date_separator वोल्टेज। इस की तर्ज पर कुछ:

.select-wrapper 
    = f.date_select :birthday, :start_year => Time.now.year - 120, :end_year => Time.now.year, :date_separator => '</div><div class="select-wrapper">' 

Answer 3

इस सुंदर नहीं है, लेकिन यह मेरे लिए अच्छी तरह से काम ...

<div class="small-4 columns"><%= f.date_select :release_date, {date_separator: "</div><div class='small-4 columns'>"} %></div> 

कहाँ <div class="small-4 columns"></div> मैं क्या सब कुछ में लपेटा जा करना चाहता था मूल रूप से। बस यह सुनिश्चित कर लें कि date_separator मेरे टैग को बंद करने और मेरे अगले के उद्घाटन को बंद कर रहा था, और यह सुनिश्चित कर लिया कि मेरा पहला टैग खोलने से पहले date_select था और मेरा अंतिम टैग बंद होने से date_select के बाद था।

Answer 4

How to let custom FormBuilder wrap datetime_select's selects in e.g. a div? में मुझे मूल रूप से एक ही समस्या का सामना करना पड़ता है।

जावास्क्रिप्ट मेरे लिए एक विकल्प नहीं है और date_separator हैक है ... एक हैक :)

मैं निम्नलिखित समाधान के साथ आया था (मेरे लिए काम करता है, Haml में)। मुझे लगता है कि यह अब तक स्वच्छतम समाधान है लेकिन कुछ रेल इंटर्न पर निर्भर करता है।

- date_time_selector = ActionView::Helpers::DateTimeSelector.new(Time.current, 
      { prefix: @usage.model_name.param_key, 
       field_name: :starttime.to_s, 
       include_position: true }) 
.select 
    = date_time_selector.select_year 
.select 
    = date_time_selector.select_month 
.select 
    = date_time_selector.select_day 
.select 
    = date_time_selector.select_hour 
.select 
    = date_time_selector.select_minute 

आप सभी को समायोजित किया जाता है prefix (मेरे मामले में @usage) और field_name (गुण-नाम, @usage.starttime/ starttime मेरे मामले में) क्या करना है

। इस उदाहरण में, मैं संबंधित दिनांक फ़ील्ड को "चयन" श्रेणी के एक div में लपेटता हूं।

• https://github.com/rails/rails/blob/2c97fbf6503c9199f3fe5ed06222e7226dc6fcd9/actionview/lib/action_view/helpers/tags/date_select.rb (FormBuilders इस मार्ग का उपयोग करेगा)
• https://github.com/rails/rails/blob/2c97fbf6503c9199f3fe5ed06222e7226dc6fcd9/actionview/lib/action_view/helpers/date_helper.rb (असली मांस)

:

संदर्भ के लिए, कई और अधिक विकल्पों के साथ यहां प्रासंगिक कोड के लिंक हैं खेलने के लिए देखते हैं