एक CSS क्लास को <% = f.submit%> में जोड़ें


जवाबों:


352
<%= f.submit 'name of button here', :class => 'submit_class_name_here' %>

यह करना चाहिए। यदि आपको कोई त्रुटि हो रही है, तो संभावना है कि आप नाम की आपूर्ति नहीं कर रहे हैं।

वैकल्पिक रूप से, आप एक वर्ग के बिना बटन को स्टाइल कर सकते हैं:

form#form_id_here input[type=submit]

कोशिश करें कि, साथ ही।


अति उत्कृष्ट! शुक्रिया श्रीजन। एक छोटी सी जिज्ञासा - मैंने disable_withइन सबमिट बटन का उपयोग करने की कोशिश की है, लेकिन वे कभी काम नहीं करते हैं। क्या कोई ऐसा कारण है जिसके बारे में आप जानते हैं? +1
sscirrus

3
विकल्पों के लिए हैश के साथ प्रयास करें: {: class => 'class_name',: disable_with => 'संपादन ... "। यह बटन के नाम के बाद जाएगा। यह काम करना चाहिए, या कम से कम यह रूप में प्रलेखित है।
श्रीजान पेजिक

3
ध्यान दें कि आपको स्पष्ट रूप से एक स्ट्रिंग ('यहां बटन का नाम') पास करने की जरूरत है submitताकि ऊपर दिए गए उत्तर में: हैश वर्ग का उपयोग करने के लिए पहला तर्क दिया जा सके। यदि आपके पास वह स्ट्रिंग नहीं है, तो आपको एक त्रुटि संदेश मिलेगा।
thewillcole

7
डिफ़ॉल्ट मान उत्तर
निकाले

<%= form.submit :class => 'class_name' %>काम करता है, अगर आप नाम का उपयोग नहीं करना चाहते हैं।

141

आप निम्न करके फार्म के सबमिट बटन में एक वर्ग घोषणा जोड़ सकते हैं:

<%= f.submit class: 'btn btn-default' %> <- ध्यान दें: कोई अल्पविराम नहीं है!

यदि आप एक scaffold का एक _ form.html.erb आंशिक रूप से बदल रहे हैं और आप नियंत्रक क्रियाओं के बीच बटन नाम का गतिशील परिवर्तन रखना चाहते हैं, तो एक नाम निर्दिष्ट न करें 'name'

एक नाम निर्दिष्ट किए बिना और कार्रवाई के आधार पर प्रपत्र प्रदान किए जाने पर बटन को .class = "btn btn-default"बूटस्ट्रैप क्लास (या जो भी .classआप निर्दिष्ट करते हैं) निम्न नामों के साथ मिलेगा :

  • मॉडल_नाम अपडेट करें

  • Model_name बनाएं
    (जहां model_name पाड़ के मॉडल का नाम है)


13
चयनित उत्तर की तुलना में कम वोट होने के बावजूद, यह वह समाधान है जिसका अधिकांश लोग उपयोग करना चाहते हैं।
आईएएमएनएन

3
यही मैं खोजने की कोशिश कर रहा था
संदीप गर्ग

1
डिफ़ॉल्ट, रेल-जनरेटेड बटन टेक्स्ट को बदले बिना HTML विशेषता ("आईडी" या "क्लास, उदाहरण में") जोड़ने की अनुमति देता है।
TK-421

1
IMO यह सबसे अच्छा उत्तर है क्योंकि यह नियंत्रक क्रिया के आधार पर बटन ("क्रिएट" या "अपडेट") को डायनामिक रूप से असाइन करने वाले टेक्स्ट के व्यवहार को संरक्षित करता है
साठ

निश्चित रूप से @ साठवाचक ने कहा। अनुवाद फ़ाइलों में बटन पाठ सेट किया जाना चाहिए, इसलिए फॉर्म को विभिन्न नियंत्रक क्रियाओं में पुन: उपयोग किया जा सकता है, अर्थात 'टिप्पणी' बनाम 'टिप्पणी टिप्पणी' बनाएं। इसका जवाब देखें - stackoverflow.com/a/18255633/5355691
जार्विस जॉनसन

26

रेल्स 4 और बूटस्ट्रैप 3 "प्राथमिक" बटन

<%= f.submit nil, :class => 'btn btn-primary' %>

पैदावार कुछ इस तरह है:

स्क्रीन 2014-01-22_02.24.26.png


2
यह वास्तव में सबसे अच्छा है क्योंकि nilनाम के लिए निर्दिष्ट करना सहायक के डिफ़ॉल्ट व्यवहार को बनाए रखता है, जहां, यदि यह ऑब्जेक्ट के लिए एक उदाहरण चर बनाता है / प्रदर्शित किया जा रहा है, जैसे कि @person, यह तदनुसार बटन का नाम देगा (अपडेट फू या क्रिएट फू) और form_forफॉर्म्युलेरस्टाइल भी सही कार्रवाई चुनता है। तो इस तरह से आप फॉर्म कोड को एक आंशिक में निकाल सकते हैं और मॉडल ऑब्जेक्ट को प्रदर्शित करने के लिए इसका उपयोग कर सकते हैं (यदि आप इसे प्रदर्शित करने के लिए किसी फॉर्म का उपयोग करना चाहते हैं), तो इसे अपडेट करें और साथ ही एक नया उदाहरण बनाएं।
पॉल-सेबेस्टियन मैनोल

13

जैसा कि श्रीजन पेजिक कहते हैं, आप उपयोग कर सकते हैं

<%= f.submit 'name', :class => 'button' %>

या नया सिंटैक्स जो होगा:

<%= f.submit 'name', class: 'button' %>

9

समाधान जब form_with सहायक का उपयोग कर

रेल 5.2 का उपयोग करने वालों के लिएform_withहेल्पर के साथ : कॉमा को न जोड़ें !

<%= f.submit class: 'btn btn-primary' %>

कोई अल्पविराम के साथ स्क्रीनशॉट

HTH!


2

डिफ़ॉल्ट रूप से, रेल 4 दृश्य बटन पाठ को नियंत्रित करने के लिए 'मान' विशेषता का उपयोग करता है, इसलिए मार्कअप को साफ रखने के लिए मैं उपयोग करूंगा

<%= f.submit :value => "Visible Button Text", :class => 'class_name' %>

0

दोनों काम करते हैं <%= f.submit class: "btn btn-primary" %>और <%= f.submit "Name of Button", class: "btn btn-primary "%>

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.