लेबल को संरेखित करें और मिठाई 2 में एक ही पंक्ति में ड्रॉपडाउन का चयन करें [बंद]

Question

मैं उदाहरण के लिए देख रहा हूँ जहाँ मैं Sweetalert2 का उपयोग करके एक ही पंक्ति में लेबल और ड्रॉपडाउन संरेखित कर सकता हूं।

मैंने इसे प्राप्त करने के लिए कस्टम लेबल जोड़ने की कोशिश की है लेकिन यह अलग लाइन में जा रहा है और मैं ओके बटन पर क्लिक करने पर चयनित ड्रॉपडाउन को सांत्वना देना चाहूंगा।

नीचे मेरा स्टैकब्लिट्ज़ है।

https://stackblitz.com/edit/angular-sweetalert-dropdown

Answer 1

का प्रयोग करें inputLabel+ customClassparams:

Swal.fire({
  title: 'Select + label in one row',
  input: 'select',
  inputOptions: {
    apples: 'Apples',
    bananas: 'Bananas',
    oranges: 'Oranges'
  },
  inputLabel: 'Select a fruit',
  customClass: {
    input: 'inline-flex',
    inputLabel: 'inline-flex'
  }
})

.inline-flex {
  display: inline-flex !important;
  margin: .5em !important;
}

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script> 

इसके बारे में और पढ़ें customClass:https://sweetalert2.github.io/#customClass

Answer 2

आप सादे / स्टाइल वाले html का उपयोग कर सकते हैं और सामान्य रूप से ड्रॉपडाउन मान को पकड़ सकते हैं:

 Swal.fire({

  showCancelButton: true,
  type: "warning",
  html: ` select reason <select name="cars" id="cars">
          <option value="volvo">Volvo</option>
          <option value="saab">Saab</option>
          <option value="mercedes">Mercedes</option>
          <option value="audi">Audi</option>
          </select>`,

  preConfirm: function() {
  var elm = document.getElementById("cars");
  alert(elm.value); // use user selected value freely
  }

   });