एकल चयन के लिए चुने गए प्लगइन के लिए प्लेसहोल्डर टेक्स्ट

Question

मेरे पास मेरे कोड में लागू एकल चयन के लिए चुनी गई प्लगइन है। मैं खोज बॉक्स के लिए प्लेसहोल्डर टेक्स्ट जोड़ने की कोशिश कर रहा हूं लेकिन मैं सक्षम नहीं हूं। मैं निम्नलिखित बातें की कोशिश की है:

<select id="search_pi" name="search_pi" type="text" class="chosen-select" 
     style="width:450px;" onchange="this.form.submit()" > 

    <option value="">Search Project/Initiative...</option> 
    <?php 
    include "../includes/search_dropdown.php"; 
    foreach($proj_ini_Array as $qa){ 
     echo "<option value = \"$qa\">$qa</option>"; 
    } 
    ?> 

जे एस

<script> 
    $(document).ready(function() { 
    $('.chosen-select').chosen({ 
     placeholder_text_single: "Select an option", 
     no_results_text: "Oops, nothing found!" 
    }); 
    }); 
</script> 

चयन क्षेत्र में, मैं भी data-placeholder="Select an option" का उपयोग कर की कोशिश की लेकिन वह भी मदद नहीं करता है। क्या कोई मुझे बता सकता है कि मुझे क्या याद आ रहा है?

अग्रिम धन्यवाद।

Answer 1

ठीक है। मुझे जवाब मिला। सिंगल सिलेक्ट सर्च बॉक्स के लिए प्लेसहोल्डर टेक्स्ट को सक्रिय करने के लिए हमें रिक्त स्थान के रूप में पहला विकल्प होना चाहिए।

<select id="search_pi" name="search_pi" type="text" class="chosen-select" style="width:450px;" onchange="this.form.submit()" > 

    <option> </option> 
    <?php 
    include "../includes/search_dropdown.php"; 
    foreach($proj_ini_Array as $qa){ 
     echo "<option value = \"$qa\">$qa</option>"; 
    } 
    ?> 

उपरोक्त मामले में, प्लेसहोल्डर टेक्स्ट "विकल्प का चयन करें" के लिए डिफ़ॉल्ट होगा।

किसी एक खोज सलेक्ट बॉक्स आप अपने js नीचे के रूप में फाइल को संपादित करने और प्लेसहोल्डर पाठ के लिए खाली पहला विकल्प हो सकता है के लिए एक अनुकूलित प्लेसहोल्डर-पाठ के लिए प्रदर्शित करने के लिए:

<script> 
    $(document).ready(function() { 
    $('.chosen-select').chosen({ 
     placeholder_text_single: "Select Project/Initiative...", 
     no_results_text: "Oops, nothing found!" 
    }); 
    }); 
</script> 

Answer 2

अपने पहले विकल्प के लिए बस एक मार्गदर्शन पाठ बनाने के लिए, लेकिन असमर्थ उपयोगकर्ताओं के लिए यह चयन करने के लिए, इस का उपयोग करें:

<option selected="selected" disabled>Search Project/Initiative...</option> 

* संपादित करें *

अपने प्रश्न आह खेद है, पढ़ने के लिए नहीं किया था शुरू करने के लिए स्पष्ट रूप से पर्याप्त है।

स्पष्ट रूप से पहले <option> को खाली होने की आवश्यकता है। this jsfiddle देखें।

Answer 3

उपयोग data-placeholder="YOUR TEXT"select टैग में

Answer 4

यदि आप जेएस के बजाय HTML के माध्यम से निर्माण कर रहे हैं तो वास्तव में इस समस्या का बेहतर/आसान समाधान है। आपको दो चीजें करना है।

1. आपके <select> में पहले <option> खाली होना चाहिए।
2. आपको <select> में placeholder="Placeholder goes here" शामिल करना चाहिए। जाहिर है इसे एक बार data-placeholder कहा जाता था, जो मुझे लगता है कि कुछ भ्रम पैदा हुआ है।

तो, कुल में:

<select placeholder="Placeholder goes here"> 
    <option><!-- Empty option goes here. --><option> 
    <option>Other Option</option> 
</select> 

Answer 5

उपयोगकर्ता प्रतिक्रिया @Zack Joerdan मेरी समस्या हल। तो वसंत के विकल्प के अंदर मूल्य

<select placeholder="Placeholder goes here"> 
    <option value=""><!-- Empty option goes here. --><option> 
    <option>Other Option</option> 
</select>