2012-12-26 24 views
5

मैं बूटस्ट्रैप में दबाए गए बटनों की "स्थिति" कैसे प्राप्त करूं?ट्विटर बूटस्ट्रैप: बूटस्ट्रैप चेकबॉक्स बटन प्राप्त करें

आईई। मैं इस कोड है, जो एक चेकबॉक्स की तरह बटन 'टॉगल' बनाता उपयोग कर रहा हूँ:

<div class="btn-group" data-toggle="buttons-checkbox"> 
    <button type="button" class="btn btn-primary">Left</button> 
    <button type="button" class="btn btn-primary">Middle</button> 
    <button type="button" class="btn btn-primary">Right</button> 
</div> 

कौन सा the bootstrap manual here.

लेकिन जहाँ से मैं फिर एक बटन सबमिट करें क्लिक है - $ _POST में निहित कोई डाटा नहीं है। मुझे कैसे पता चलेगा कि कौन से बटन चुने गए हैं?

मैंने बटनों के साथ 'value="1" name="1"' आदि जोड़ने की कोशिश की है - लेकिन अभी भी कुछ भी नहीं है।

संपादित करें: यहां पूर्ण समाधान है, जिसे मैं नीचे फ़ेलिक्स से सहायता का उपयोग करने में सक्षम था।

<form method="post" action="" id="mform" class="form-horizontal"> 
<div class="btn-group" data-toggle="buttons-checkbox"> 
    <button type="button" name="left" value="1" class="btn btn-primary">Left</button> 
    <button type="button" name="middle" value="1" class="btn btn-primary">Middle</button> 
    <button type="button" name="right" value="1" class="btn btn-primary">Right</button> 
</div> 
<button type="submit" class="btn">Submit</button> 
</form> 

<script> 
    $('#mform').submit(function() { 
     $('#mform .btn.active').each(function() { 
      var input = document.createElement("input"); 
      input.setAttribute("type", "hidden"); 
      input.setAttribute("name", this.name); 
      input.setAttribute("value", this.value); 
      document.getElementById("mform").appendChild(input); 
     }); 
    }); 
</script> 

उत्तर

15

बटन है कि "चयनित" कर रहे हैं active वर्ग उन्हें संलग्न करना होगा। फिर आप केवल उन बटनों का चयन करने के लिए jQuery का उपयोग कर सकते हैं। चूंकि button एस फॉर्म तत्व हैं, इसलिए उनके पास name और value विशेषताएँ हो सकती हैं और शायद उन लोगों का उपयोग करना सबसे अच्छा है।

उदाहरण:

var data = {}; 

$('#myButtonGroup .btn.active').each(function() { 
    data[this.name] = this.value; 
}); 

सर्वर से डेटा भेजने के लिए आपको अजाक्स का उपयोग करेंगे सकता है और मैन्युअल रूप से डेटा सेट/अन्य प्रपत्र डेटा के साथ मर्ज (यदि वह मौजूद है)।

यदि आप "पारंपरिक" फ़ॉर्म सबमिशन (Change form values after submit button pressed देखें) का उपयोग करना चाहते हैं तो आप सबमिट पर छिपे हुए फॉर्म तत्वों में मानों को दर्पण करने का प्रयास कर सकते हैं।

-1

आप वर्तमान स्थिति प्राप्त करने के लिए बूटस्टैप स्विच विधि स्थिति का भी उपयोग कर सकते हैं।

var data = {}; 

$('#myButtonGroup .btn.active').each(function(index,element) { 
    data[this.name] = jQuery(element).bootstrapSwitch('state') 
}); 
+0

पूर्वाेश, मुझे विश्वास नहीं है कि ओपी ने बूटस्ट्रैपविच लाइब्रेरी का उपयोग करने के बारे में कुछ भी कहा - यह पूरी तरह अलग है और बूटस्ट्रैप का मूल भाग नहीं है ... – MandM

संबंधित मुद्दे