jquery - মান দ্বারা নির্বাচন করুন 'নির্বাচিত' অপশন নির্বাচন করুন




jquery-selectors html-select (15)

আমি কিছু অপশন সঙ্গে একটি select ক্ষেত্র আছে। এখন আমি jQuery সঙ্গে যারা options এক নির্বাচন করতে হবে। কিন্তু আমি কীভাবে তা করতে পারি যখন আমি শুধুমাত্র সেই option value জানতে পারি যা নির্বাচন করা উচিত?

আমি নিম্নলিখিত এইচটিএমএল আছে:

<div class="id_100">
  <select>
    <option value="val1">Val 1</option>
    <option value="val2">Val 2</option>
    <option value="val3">Val 3</option>
  </select>
</div>

আমি মান val2 সঙ্গে বিকল্প নির্বাচন করতে হবে। কিভাবে এই কাজ করা যেতে পারে?

এখানে একটি ডেমো পৃষ্ঠা: http://jsfiddle.net/9Stxb/


.attr () কখনও কখনও পুরোনো jQuery সংস্করণে কাজ করে না, তবে আপনি .prop () ব্যবহার করতে পারেন:

$('select#ddlCountry option').each(function () {
    if ($(this).text().toLowerCase() == co.toLowerCase()) {
        $(this).prop('selected','selected');
        return;
    }
});

আপনি এ্যাট্রিবিউট নির্বাচক [attributename=optionalvalue] ব্যবহার করে যেকোনো গুণ এবং তার মান নির্বাচন করতে পারেন, তাই আপনার ক্ষেত্রে আপনি বিকল্পটি নির্বাচন করতে এবং নির্বাচিত বৈশিষ্ট্যটি সেট করতে পারেন।

$("div.id_100 > select > option[value=" + value + "]").prop("selected",true);

যেখানে value আপনি নির্বাচন করতে চান মান।

যদি আপনি পূর্বে নির্বাচিত মানগুলি সরিয়ে ফেলতে চান তবে এটি যদি একাধিকবার ব্যবহার করা হয় তবে এটি আপনাকে সামান্য পরিবর্তন করতে হবে যাতে প্রথমে নির্বাচিত বৈশিষ্ট্যটি সরাতে হয়।

$("div.id_100 option:selected").prop("selected",false);
$("div.id_100 option[value=" + value + "]")
        .prop("selected",true);

আমি ভ্যাল () সেট করতে সবচেয়ে সহজ উপায় নির্বাচন করা হয়, কিন্তু আপনি নিম্নলিখিত চেক করতে পারেন। কিভাবে jQuery এ নির্বাচন এবং বিকল্প ট্যাগ হ্যান্ডেল দেখুন ? বিকল্প সম্পর্কে আরো বিস্তারিত জানার জন্য।

$('div.id_100  option[value="val2"]').prop("selected", true);

$('id_100').val('val2');

অপ্টিমাইজ করা নেই, তবে কিছু লজিকও কিছু ক্ষেত্রে দরকারী।

$('.id_100 option').each(function() {
    if($(this).val() == 'val2') {
        $(this).prop("selected", true);
    }
});

এই ভাল কাজ করে

jQuery('.id_100').change(function(){ 
        var value = jQuery('.id_100').val(); //it gets you the value of selected option 
        console.log(value); // you can see your sected values in console, Eg 1,2,3
    });

এটা চেষ্টা কর. সহজ এখনো কার্যকর Javascript + jQuery প্রাণঘাতী কম্বো।

SelectComponent:

<select id="YourSelectComponentID">
            <option value="0">Apple</option>
            <option value="2">Banana</option>
            <option value="3">Cat</option>
            <option value="4">Dolphin</option>
</select>

নির্বাচন :

document.getElementById("YourSelectComponentID").value = 4;

এখন আপনার অপশন 4 নির্বাচন করা হবে। ডিফল্টভাবে শুরু করতে মানগুলি নির্বাচন করতে আপনি এটি করতে পারেন।

$(function(){
   document.getElementById("YourSelectComponentID").value = 4;
});

অথবা একটি সাধারণ ফাংশন তৈরি করুন এটিতে লাইনটি রাখুন এবং বিকল্পটি নির্বাচন করার জন্য anyEvent এ ফাংশনটি কল করুন

JQuery + জাভাস্ক্রিপ্ট একটি মিশ্রণ জাদু না ....


এটি নির্বাচন নিয়ন্ত্রণের জন্য নিশ্চিতভাবে কাজ করে:

$('select#ddlCountry option').each(function () {
if ($(this).text().toLowerCase() == co.toLowerCase()) {
    this.selected = true;
    return;
} });

এটি নির্বাচন মান change() পরে change() ব্যবহার ভাল।

$("div.id_100 select").val("val2").change();

এটি করার মাধ্যমে, কোডটি ব্যবহারকারীর দ্বারা পরিবর্তনের পরিবর্তে বন্ধ হবে, ব্যাখ্যাটি জেএস ফিডলে অন্তর্ভুক্ত করা হয়েছে:

জেএস ফিডল


এটিকে তাত্পর্যপূর্ণ করার কোনো কারণ নেই, আপনি যা করছেন তা অ্যাক্সেস করা এবং একটি সম্পত্তি সেট করা। এটাই.

ঠিক আছে, তাই কিছু মৌলিক ডোম: আপনি যদি সরাসরি জাভাস্ক্রিপ্টে এটি করছিলেন, তবে আপনি এটি করবেন:

window.document.getElementById('my_stuff').selectedIndex = 4;

কিন্তু আপনি সরাসরি জাভাস্ক্রিপ্ট দিয়ে এটি করছেন না, আপনি jQuery এর সাথে এটি করছেন। এবং jQuery এ, আপনি একটি সম্পত্তি সেট করতে .prop () ফাংশন ব্যবহার করতে চান, তাই আপনি এটি এমনভাবে করবেন:

$("#my_stuff").prop('selectedIndex', 4);

যাইহোক, শুধু আপনার আইডি অনন্য নিশ্চিত করুন। অন্যথায়, আপনি প্রাচীর উপর আপনার মাথা banging হবে কেন এই কাজ করে না ভাবছি।


প্রথমে সব অনির্বাচন করুন এবং নির্বাচনযোগ্য বিকল্প ফিল্টার করুন:

$('.id_100 option')
     .removeAttr('selected')
     .filter('[value=val1]')
         .attr('selected', true)

বিকল্প ট্যাগটিতে যেতে আপনার কোনও সহজ উপায় নেই:

$("div.id_100 select").val("val2");

এই jQuery পদ্ধতি পরীক্ষা করে দেখুন।


মান 'Val2' দিয়ে একটি বিকল্প নির্বাচন করতে:

$('.id_100 option[value=val2]').attr('selected','selected');

মান নির্বাচন করার পরে change() ইভেন্ট ব্যবহার করুন। ডক্স থেকে:

যদি ক্ষেত্রটি পরিবর্তন না করেই ক্ষেত্রটি ফোকাস হারাবে, ইভেন্টটি ট্রিগার হয় না। ম্যানুয়ালি ইভেন্টটি ট্রিগার করতে, আর্গুমেন্ট ছাড়াই .change() প্রয়োগ করুন:

$("#select_id").val("val2").change();

আরো তথ্য .change()


$('#graphtype option[value=""]').prop("selected", true);

এটি #graphtype নির্বাচন ট্যাগের আইডি যেখানে ভাল কাজ করে।

উদাহরণ ট্যাগ নির্বাচন করুন:

 <select name="site" id="site" class="form-control" onchange="getgraph1(this.options[this.selectedIndex].value);">
    <option value="" selected>Site</option> 
    <option value="sitea">SiteA</option>
    <option value="siteb">SiteB</option>
  </select>

var opt = new Option(name, id);
$("#selectboxName").append(opt);
opt.setAttribute("selected","selected");

  • আপনি যে পরিবর্তনটি পরিবর্তন করতে চান তার মানটি অবশ্যই আপনার মনে রাখতে হবে, আপনার HTML এ সংজ্ঞায়িত বিকল্পগুলির মধ্যে উপস্থিত থাকা আবশ্যক হিসাবে এটি অবশ্যই সংবেদনশীল। আপনি নিম্নরূপ গতিশীলভাবে আপনার নির্বাচন বক্স পরিবর্তন করতে পারেন,

$("div#YOUR_ID").val(VALUE_CHANGED).change(); //value must present in options you selected otherwise it will not work






html-select