ডিফল্ট রূপে অক্ষম এইচটিএমএল নির্বাচন বিকল্পটি কীভাবে প্রদর্শন করবেন?


139

আমি এইচটিএমএল এবং পিএইচপি-তে নতুন এবং মাইএসকিএল টেবিল থেকে একটি ড্রপ-ডাউন মেনু অর্জন করতে চাই এবং হার্ড-কোডডও। আমার পৃষ্ঠায় আমার একাধিক নির্বাচন রয়েছে, এর মধ্যে একটি

<select name="tagging">
    <option value="">Choose Tagging</option>
    <option value="Option A">Option A</option>
    <option value="Option B">Option B</option>
    <option value="Option C">Option C</option>
</select>

সমস্যা এখন যে ব্যবহারকারী তার ট্যাগিং হিসাবে "বেছে নিন ট্যাগিং" নির্বাচন করতে পারেন তবে আমি কেবল তাকে উপলব্ধ তিনটি থেকে চয়ন করতে চাই। আমি হিসাবে অক্ষম ব্যবহার

<select name="tagging">
    <option value="" disabled="disabled">Choose Tagging</option>
    <option value="Option A">Option A</option>
    <option value="Option B">Option B</option>
    <option value="Option C">Option C</option>
</select>

তবে এখন "অপশন এ" ডিফল্ট হয়ে উঠেছে। সুতরাং আমি ডিফল্ট হিসাবে "চয়ন পছন্দ করুন" সেট করতে চাই এবং নির্বাচন থেকে এটি অক্ষম করতে চাই। এটি করার উপায় কি? অন্যান্য সিলেকের সাথে একই জিনিস করা দরকার যা মাইএসকিএল থেকে ডেটা আনবে। যে কোনও পরামর্শ প্রশংসনীয় হবে।


প্রথম বিকল্পটি নিষ্ক্রিয় করতে নির্বাচন ক্লিকের কীভাবে যোগ করবেন।
ডেভিড কামার

আপনাকে সিনট্যাক্স ত্রুটিটি ঠিক করতে হবে - মান = "" অক্ষম হওয়া উচিত = "অক্ষম" + বিজোড় ক্লোজিং অপসারণ করুন </ বাছাই করুন ট্যাগগুলি
ইভ্জিনি

@ অ্যাভেজিনি উফ! যে << নির্বাচন> আমার কোডের অন্য অংশের সাথে সম্পর্কিত
অঙ্কিত শর্মা

@ অঙ্কিতশর্মা আমি আপনার কোড সম্পাদনা করেছি - আপনি </ সিলেক্টেড << নির্বাচন> <ফোকেন> ... <ফোকেশন> </ সিলেক্ট>
এভেজেনি

@ এভেজিনি থ্যাঙ্কস ..... </ সিলেক্ট> ভুল করে আমার কোড থেকে অনুলিপি করা হয়েছে।
অঙ্কিত শর্মা

উত্তর:


290

ব্যবহার

<option selected="true" disabled="disabled">Choose Tagging</option>    

42
আপনার মান trueবা disabledমান রাখার দরকার নেই। আপনি যা করতে পারেন<option selected disabled>Choose Tagging</option>
স্যাম ইটন

18
@ স্যামিটন, এটি কেবলমাত্র বৈধ এক্সএইচটিএমএল সিনট্যাক্স অনুসরণ করার কোড তৈরি করে, অন্যথায় HTML5 এ আপনি এটিকে অবহেলা করতে পারেন।
ক্রিস

1
আপনার মান = "" সেট করা উচিত তাই আপনার যদি প্রয়োজনও হয় তবে ড্রপডাউন থেকে চয়ন করতে একটি ত্রুটি উত্থাপিত হবে, অন্যথায় কিছুই না নির্বাচিত হলেও একটি খালি মান পাস হয়ে যায়। <option selected="true" disabled="disabled" value="">Choose Tagging</option>
ব্যবহারকারী 34612


10

আমি জানি আপনি কীভাবে বিকল্পটি অক্ষম করবেন জিজ্ঞাসা করেছেন, তবে আমি মনে করি শেষ ব্যবহারকারীদের ভিজ্যুয়াল ফলাফলটি এই সমাধানের সাথে একই, যদিও এটি সম্ভবত সামান্য কম সংস্থার দাবী।

অপ্টগ্রুপ ট্যাগটি ব্যবহার করুন , যেমন:

<select name="tagging">
    <optgroup label="Choose Tagging">
        <option value="Option A">Option A</option>
        <option value="Option B">Option B</option>
        <option value="Option C">Option C</option>
    </optgroup>
</select>

3
এটি কাজ করে না, ওপিকে এটি ডিফল্ট দ্বারা বাছাই করা দরকার jsfiddle.net/tomsihap/5xm7grnb
tomsihap

10

ইলেক্ট্রন + প্রতিক্রিয়া আপনার দুটি প্রথম বিকল্পটি এর মতো হতে দিন

<option hidden="true>Choose Tagging</option>
<option disabled="disabled" default="true">Choose Tagging</option>

তালিকাটি খোলার পরে প্রথমে প্রদর্শিত দ্বিতীয়টিতে প্রদর্শিত হবে display


8

ব্যবহার hidden

<select>
   <option hidden>Choose</option>
   <option>Item 1</option>
   <option>Item 2</option>
</select>

এটি এটি আনসেট করে না তবে এটি ডিফল্টরূপে প্রদর্শিত হওয়ার পরে আপনি এটি অপশনগুলিতে লুকিয়ে রাখতে পারেন।


6

যারা প্রথম বিকল্পটি ফাঁকা রাখতে চান তাদের জন্য অন্য একটি নির্বাচনী সমাধান সমাধান।

<label>Unreal :</label>
<select name="unreal">
   <option style="display:none"></option>
   <option>Money</option>
   <option>Country</option>
   <option>God</option>
</select>



3

আমরা এই কৌশলটি ব্যবহার করে অক্ষম করতে পারি।

<select class="form-control" name="option_select">
  <option selected="true" disabled="disabled">Select option </option>
  <option value="Option A">Option A</option>
  <option value="Option B">Option B</option>
  <option value="Option C">Option C</option>
</select>

1

আপনি যদি আপনার নির্বাচিত উপাদানটি পূরণ করতে jQuery ব্যবহার করেন তবে আপনি এটি ব্যবহার করতে পারেন:

এইচটিএমএল

<select id="tagging"></select>

JS

array_of_options = ['Choose Tagging', 'Option A', 'Option B', 'Option C']

$.each(array_of_options, function(i, item) {
    if(i==0) { sel_op = 'selected'; dis_op = 'disabled'; } else { sel_op = ''; dis_op = ''; }
    $('<option ' + sel_op + ' ' + dis_op + '/>').val(item).html(item).appendTo('#tagging');
  })

এটি ব্যবহারকারীর অক্ষম শিরোনাম হিসাবে প্রথম বিকল্প দেখতে ('ট্যাগিং নির্বাচন করুন') দেখতে এবং অন্যান্য সমস্ত বিকল্প নির্বাচন করার অনুমতি দেবে।

এখানে চিত্র বর্ণনা লিখুন


0
            <select name="dept" id="dept">
                <option value =''disabled selected>Select Department</option>
                <option value="Computer">Computer</option>
                <option value="electronics">Electronics</option>
                <option value="aidt">AIDT</option>
                <option value="civil">Civil</option>
            </select>

ডিফল্ট দ্বারা আপনি কোন বিকল্পটি নির্বাচন করতে চান তা "নির্বাচিত" ব্যবহার করুন। ধন্যবাদ


এই নির্দেশিকাটি ইতিমধ্যে এখানে এই প্রশ্নটিতে পোস্ট করা হয়েছিল: stackoverflow.com/a/42997841/2943403 আপনার উত্তর পৃষ্ঠায় কোনও নতুন মান যুক্ত করে না এবং কেবল পৃষ্ঠা স্ফূতনে অবদান রাখে।
মিকম্যাকুসা

-1

আপনি ডিফল্টরূপে কোন বিকল্পটি নির্বাচিত তা সেট করতে পারেন:

<option value="" selected>Choose Tagging</option>

আমি ক্লিক ইভেন্টের জন্য জাভাস্ক্রিপ্ট এবং জ্যাকুয়ারি ব্যবহার করার পরামর্শ দিচ্ছি এবং অন্যটি নির্বাচিত হওয়ার পরে প্রথম বিকল্পটি অক্ষম করে দেব: প্রথমে উপাদানটিকে একটি আইডি দিন:

<select id="option_select" name="tagging">

এবং বিকল্পটি একটি আইডি:

<option value="" id="initial">Choose Tagging</option>

তারপর:

<script type="text/javascript">

$('option_select').observe(click, handleClickFunction);

তারপরে আপনি কেবল ফাংশনটি তৈরি করুন:

function handleClickFunction () {

if ($('option_select').value !== "option_select") 
{
   $('initial').disabled=true; }
}

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.