আমি jQuery ব্যবহার করে কীভাবে একটি ড্রপডাউনলিস্টের মান সেট করতে পারি?


349

প্রশ্নটি হিসাবে, আমি কীভাবে jQuery ব্যবহার করে একটি ড্রপডাউনলিস্ট নিয়ন্ত্রণের মান সেট করব?

উত্তর:


602
$("#mydropdownlist").val("thevalue");

কেবলমাত্র নিশ্চিত করুন যে বিকল্প পদ্ধতিতে মানটি ভাল পদ্ধতির মানের সাথে মেলে।


ড্রপ ডাউন তালিকার বিপরীতে আমার কাছে একটি পরিসীমা বৈধকারক রয়েছে এবং আপনি উপরে বর্ণিত হিসাবে আমি ড্রপ ডাউন তালিকার মানটি সেট করছি, তবুও পরিসীমা বৈধকারী আমাকে একটি মান নির্বাচন করতে বলতে ব্যর্থ করে রাখে (যখন নির্বাচিত মানটি সীমার মধ্যে থাকে)। দয়া করে আমার প্রশ্নটি স্ট্যাকওভারফ্লো.com
জেমস

21
এটি "পরিবর্তন" ইভেন্টটি চালিত করে না।
এগেমপ্লেয়ার

4
পুনরাবৃত্তি করতে চেয়েছিলেন - আপনার "মান" বৈশিষ্ট্য সেট আছে তা নিশ্চিত করুন, বা এই পদ্ধতিটি কাজ করবে না। (আমি এমন কাউকে সহায়তা করছিলাম যিনি আমাকে এটি দেখিয়েছিলেন এবং অবাক হয়ে যাচ্ছিলেন কেন এটি ড্রপডাউন তালিকার পাঠ্যটির মাধ্যমে নির্বাচন করছেন না that) এটি পরিষ্কার ছিল কিনা তা নিশ্চিত করতে চেয়েছিলেন।
জেসকাভ

1
+1 $("#mycontrolId").selectmenu('refresh');পরিবর্তনগুলি
প্রতিবিম্বিত

এই লিঙ্কটি সম্পর্কে
বিউন্ড /

52

আপনি যদি সূচকে কাজ করে থাকেন তবে আপনি নির্বাচিত সূচকটি সরাসরি .attr () এর সাথে সেট করতে পারেন:

$("#mydropdownlist").attr('selectedIndex', 0);

এটি ড্রপলিস্টে এটি প্রথম মান হিসাবে সেট করবে।

সম্পাদনা করুন: আমি যেভাবে উপরে এটি করেছি তা কাজ করত। তবে মনে হয় এটি আর নেই।

তবে হ্যান যেমন মন্তব্যে আনন্দদায়ক বিষয় উল্লেখ করেছেন, এটি করার সঠিক উপায় হ'ল:

$("#mydropdownlist").get(0).selectedIndex = index_here;

7
এখন, এটি মোটেও কাজ করে না কারণ selectট্যাগটির কোনও নামযুক্ত বৈশিষ্ট্য নেই selectedIndex। পরিবর্তে এটি ডিওএম অবজেক্টের সম্পত্তি। সুতরাং কোডটি হওয়া উচিত:$("#mydropdownlist").get(0).selectedIndex = index_here;
হ্যান

5
$("#mydropdownlist").prop('selectedIndex', index_here); এছাড়াও কাজ করে।
সংখ্যা

("# মাইক্রোপড ডাউনলিস্ট")। (0) পান। নির্বাচিত ইন্ডেক্স = সূচক_ এখানে; এই পথে কাজ ছিল !! @
কাসিম

ড্রপডাউনে নির্বাচিত পরিবর্তনের দুর্দান্ত উপায়, আপনাকে ধন্যবাদ
অ্যাভান্টিল কাভরলেশভিলি

আমি কি উত্তরে কিছু প্যাসিভ আগ্রাসন অনুভব করি
ধীররাজ

49

@ নিক বেরার্ডির পরামর্শ অনুসারে, যদি আপনার পরিবর্তিত মানটি ইউআই সামনের প্রান্তে প্রতিফলিত না হয় তবে চেষ্টা করুন:

$("#mydropdownlist").val("thevalue").change();

1
অনেক ধন্যবাদ, কেবলমাত্র একটি লাইন, ঝাঁঝালো এবং লারাভেল ফর্ম ব্যবহার করে একটি সিলেক্টবক্সের পরিবর্তন () ইভেন্ট বাড়াতে খুব সুন্দর এবং সহায়ক।
সোসরিয়াস

এই একমাত্র উত্তর যেখানে পরিবর্তনটি ড্রপডাউনটিতে প্রদর্শিত হয়েছিল actually selectmenujQuery এর আমার সংস্করণে অপরিজ্ঞাত আছে, তবে change()কৌতুকটি করে।
চাদ হেডককক

ধন্যবাদ। এটি আমার পক্ষে কাজ করার একমাত্র উপায় ছিল (এটির উপরে আরও কিছু করার চেষ্টা করার পরে)।
অনুপ্রেরণা

20

এই খুব সহজ পদ্ধতির চেষ্টা করুন:

/*make sure that value is included in the options value of the dropdownlist 
e.g. 
(<select><option value='CA'>California</option><option value='AK'>Alaska</option>      </select>)
*/

$('#mycontrolId').val(myvalue).attr("selected", "selected");

2
কল করতে ভুলবেন না$("#mycontrolId").selectmenu('refresh');
ভ্ল্যাডএল

@ ভ্ল্যাডএল তাই আপনার মানে $('#mycontrolId').selectmenu('refresh').val(myvalue).attr("selected", "selected");?
ডিলান জেজেনস্কি

9

যদি আপনার ড্রপডাউন Asp.Net ড্রপ ডাউন হয় তবে নীচের কোডটি ঠিক কাজ করবে,

 $("#<%=DropDownName.ClientID%>")[0].selectedIndex=0;

তবে যদি আপনার ড্রপডাউনটি এইচটিএমএল ড্রপ ডাউন হয় তবে এই কোডটি কার্যকর হবে।

 $("#DropDownName")[0].selectedIndex=0;

5

প্রশ্নের সেরা উত্তর:

$("#comboboxid").val(yourvalue).trigger("chosen:updated");

উদাহরণ:

$("#CityID").val(20).trigger("chosen:updated");

অথবা

$("#CityID").val("chicago").trigger("chosen:updated");


2

এটি করার অনেকগুলি উপায় রয়েছে। এখানে তাদের কিছু:

$("._statusDDL").val('2');

অথবা

$('select').prop('selectedIndex', 3);

1
আপনার প্রোফাইলটি ইঙ্গিত করে যে আপনি এখানে যুক্ত লিঙ্কটির সাথে যুক্ত ছিলেন। আপনার পোস্টের অধিভুক্তিটিকে স্ট্যাক এক্সচেঞ্জ / স্ট্যাক ওভারফ্লোতে স্প্যাম হিসাবে বিবেচনা না করেই আপনি কোনও কিছু সম্পর্কিত (যেমন একটি পণ্য বা ওয়েবসাইট) এর সাথে লিঙ্ক করা । দেখুন: "ভাল" স্ব প্রচারের কী বোঝায়? , স্ব-প্রচার সম্পর্কে কিছু টিপস এবং পরামর্শ , স্ট্যাক ওভারফ্লোর জন্য "স্প্যাম" এর সঠিক সংজ্ঞা কী? , এবং কি কিছু স্প্যাম করে তোলে
মাকীন

1

আমি মনে করি এটি সাহায্য করতে পারে:

    $.getJSON('<%= Url.Action("GetDepartment") %>', 
              { coDepartment: paramDepartment },
              function(data) {
                    $(".autoCompleteDepartment").empty();
                    $(".autoCompleteDepartment").append($("<option />").val(-1));
                    $.each(data, function() {
                        $(".autoCompleteDepartment").append($("<option />").val(this.CodDepartment).text(this.DepartmentName));
                    });
                    $(".autoCompleteDepartment").val(-1);                                       
              }  
             );

আপনি যদি এইভাবে করেন তবে আপনি কোনও পাঠ্য ছাড়াই একটি উপাদান যুক্ত করুন। সুতরাং, যখন আপনি ডি কম্বো ক্লিক করেন, তখন তা দেখা যায় না, তবে মান -1 আপনি পরে select ("। অটো কমপ্লিট ডিপার্টমেন্ট") দিয়ে বেছে বেছে যোগ করেছেন val (ভ -1); কম্বোর একটি কার্যকর মান আছে কিনা তা আপনাকে নিয়ন্ত্রণ করতে দিন।

আশা করি এটি যে কাউকে সাহায্য করবে।

আমার ইংরেজীর জন্য দুঃখিত.


1

আপনার যদি কেবল একটি ড্রপডাউনয়ের মান সেট করতে হয় তবে সবচেয়ে ভাল উপায়

$("#ID").val("2");

ড্রপডাউন মান আপডেট করার পরে যদি আপনাকে কোনও স্ক্রিপ্টের ট্রিগার করতে হয় যেমন আপনি যদি ড্রপডাউনটিতে কোনও onChange ইভেন্ট সেট করেন এবং আপনি ড্রপডাউন আপডেট করার পরে এটি চালাতে চান তবে আপনার এটির মতো ব্যবহারের দরকার নেই

$("#ID").val("2").change();

0

নির্বাচিত বিকল্পটি দ্রুত সেট করতে এখানে একটি ফাংশন দেওয়া হয়েছে:

function SetSelected(elem, val){
        $('#'+elem+' option').each(function(i,d){
        //  console.log('searching match for '+ elem + '  ' + d.value + ' equal to '+ val);
            if($.trim(d.value).toLowerCase() == $.trim(val).toLowerCase()){
        //      console.log('found match for '+ elem + '  ' + d.value);
                $('#'+elem).prop('selectedIndex', i);
            }
        });
    }

যুক্তি উপাদান আইডি এবং নির্বাচিত মান সহ এই ফাংশনটিকে কল করুন; এটার মত:

SetSelected('selectID','some option');

সেট করার জন্য প্রচুর নির্বাচন বিকল্প রয়েছে যখন এটি দরকারী।


0

আপনি যখন <options ....></options>অ্যাজাক্স কল দিয়ে সমস্ত লোড করেন সে ক্ষেত্রে
এই অনুসরণ করুন।

1)।
প্রাক্তনের জন্য ড্রপ-ডাউনের সেট মানের জন্য একটি পৃথক পদ্ধতি তৈরি করুন :

function set_ip_base_country(countryCode)
    $('#country').val(countryCode)
} 

2)। যখন এইচএক্সএক্স কল সাফল্য সমস্ত এইচটিএমএল অ্যাপেন্ড টাস্ক সম্পূর্ণ হয় তখন এই পদ্ধতিটি কল করুন

প্রাক্তন জন্য:

success: function (doc) {
  .....
  .....
  $("#country").append('<option style="color:black;" value="' + key + '">'  +   value + '</option>')
  set_ip_base_country(ip_base_country)
}

0

drop-down selectedমান এবং আপডেট পরিবর্তন সেট করুন

$("#PR2DistrictId option[value='@Model.PR2DistrictId']").attr("selected", true).trigger("chosen:updated")

এখানে আমরা প্রথমে পছন্দ থেকে Modelএটি আপডেট এবং তার চেয়ে মান নির্ধারণ করি


0

// ড্রপডাউন তালিকার এইচটিএমএল ফর্ম্যাট।

<select id="MyDropDownList">
<option value=test1 selected>test1</option>
<option value=test2>test2</option>
<option value=test3>test3</option>
<option value=test4>test4</option>

// আপনি যদি জাভাস্ক্রিপ্ট ব্যবহার করে নির্বাচিত আইটেমটিকে টেস্ট 2 তে পরিবর্তন করতে চান। আর একবার চেষ্টা কর. // আপনি পরবর্তী নির্বাচন করতে চান পরবর্তী বিকল্প সেট করুন

var NewOprionValue = "Test2"

        var RemoveSelected = $("#MyDropDownList")[0].innerHTML.replace('selected', '');
        var ChangeSelected = RemoveSelected.replace(NewOption, NewOption + 'selected>');
        $('#MyDropDownList').html(ChangeSelected);

0

উপরের হাইলাইট / চেক করা উত্তরটি আমার পক্ষে কাজ করেছে ... এখানে কিছুটা অন্তর্দৃষ্টি। আমি ইউআরএল পেয়ে কিছুটা প্রতারণা করেছি, তবে মূলত আমি জাভাস্ক্রিপ্টে ইউআরএল সংজ্ঞায়িত করছি, এবং তারপরে এটিকে জেকারি উত্তরের মাধ্যমে সেট করে দিচ্ছি:

<select id="select" onChange="window.location.href=this.value">
    <option value="">Select a task </option>
    <option value="http://127.0.0.1:5000/choose_form/1">Task 1</option>
    <option value="http://127.0.0.1:5000/choose_form/2">Task 2</option>
    <option value="http://127.0.0.1:5000/choose_form/3">Task 3</option>
    <option value="http://127.0.0.1:5000/choose_form/4">Task 4</option>
    <option value="http://127.0.0.1:5000/choose_form/5">Task 5</option>
    <option value="http://127.0.0.1:5000/choose_form/6">Task 6</option>
    <option value="http://127.0.0.1:5000/choose_form/7">Task 7</option>
    <option value="http://127.0.0.1:5000/choose_form/8">Task 8</option>
</select>
<script>
    var pathArray = window.location.pathname.split( '/' );
    var selectedItem = "http://127.0.0.1:5000/" + pathArray[1] + "/" + pathArray[2];
    var trimmedItem = selectedItem.trim();
    $("#select").val(trimmedItem);
</script>

0

বুটস্ট্র্যাপ ব্যবহার করা লোকেদের $(#elementId').selectpicker('val','elementValue')পরিবর্তে ব্যবহার করুন$('#elementId').val('elementValue') -তে মান আপডেট না করায় ।

দ্রষ্টব্য : এমনকি .change()কিছু উত্তরের উপরে প্রস্তাবিত হিসাবে ফাংশনও কাজ করে, তবে এটি $('#elementId').change(function(){ //do something })ফাংশনটিকে ট্রিগার করে ।

ভবিষ্যতে এই থ্রেডটির উল্লেখকারীদের জন্য কেবল এটি পোস্ট করা।

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