javascript - while - ওয়েব ডেভেলপারদের আয়




আপনি কিভাবে একটি নির্বাচিত বক্সের সমস্ত বিকল্পগুলি সরাবেন এবং তারপরে একটি বিকল্প যুক্ত করুন এবং jQuery এর সাথে এটি নির্বাচন করবেন? (14)

কোর jQuery ব্যবহার করে, আপনি কিভাবে একটি নির্বাচিত বক্সের সমস্ত বিকল্পগুলি সরাবেন, তারপরে একটি বিকল্প যোগ করুন এবং এটি নির্বাচন করুন?

আমার নির্বাচন বক্স নিম্নলিখিত।

<Select id="mySelect" size="9" </Select>

সম্পাদনা করুন: নিম্নলিখিত কোড চেইন সঙ্গে সহায়ক ছিল। যাইহোক, (ইন্টারনেট এক্সপ্লোরারে) .val('whatever') না .val('whatever') যোগ করা হয়েছে বিকল্পটি নির্বাচন করে নি। (আমি একই 'মান' ব্যবহার করেছি .append এবং .append ।)

$('#mySelect').find('option').remove().end().append('<option value="whatever">text</option>').val('whatever');

সম্পাদনা করুন: এই কোডটি অনুকরণ করার জন্য এটি চেষ্টা করার সময়, যখনই পৃষ্ঠা / ফর্মটি পুনরায় সেট হয় তখন আমি নিম্নলিখিত কোডটি ব্যবহার করি। এই নির্বাচন বাক্সটি রেডিও বোতামগুলির একটি সেট দ্বারা জনবহুল। .focus() কাছাকাছি ছিল, কিন্তু বিকল্পটি পছন্দ করে না বলে নির্বাচিত হয়েছে। নির্বাচিত .selected= "true" । আমার বিদ্যমান কোডের সাথে কিছুই ভুল নয় - আমি শুধু jQuery শিখতে চেষ্টা করছি।

var mySelect = document.getElementById('mySelect');
mySelect.options.length = 0;
mySelect.options[0] = new Option ("Foo (only choice)", "Foo");
mySelect.options[0].selected="true";

সম্পাদনা করুন: নির্বাচিত উত্তরটি আমার যা দরকার তার কাছাকাছি ছিল। এটা আমার জন্য কাজ করেছে:

$('#mySelect').children().remove().end().append('<option selected value="whatever">text</option>') ;

কিন্তু উভয় উত্তর আমাকে আমার চূড়ান্ত সমাধান নেতৃত্বে ..


  1. প্রথমে এক্সিকিউট করার বিকল্পটি প্রথমটি পরিষ্কার করুন প্রথমটি নির্বাচন করুন (- নির্বাচন করুন)

  2. এক দ্বারা লুপ এক ব্যবহার করে নতুন বিকল্প মান যোগ করুন

    $('#ddlCustomer').find('option:not(:first)').remove();
    for (var i = 0; i < oResult.length; i++) {
       $("#ddlCustomer").append(new Option(oResult[i].CustomerName, oResult[i].CustomerID + '/' + oResult[i].ID));
    }

অন্য উপায়:

$('#select').empty().append($('<option>').text('---------').attr('value',''));

এই লিঙ্কে, ভাল পদ্ধতি রয়েছে https://api.jquery.com/select/


আপনি "একটি যোগ করুন এবং এটি নির্বাচন করুন" এর দ্বারা কী বোঝাতে চান তা ঠিক না নিশ্চিত, যেহেতু এটি ডিফল্টভাবেই নির্বাচন করা হবে। কিন্তু, যদি আপনি একাধিক যোগ করতে চান তবে এটি আরো অর্থপূর্ণ হবে। কিভাবে ভালো কিছু সম্পর্কে:

$('select').children().remove();
$('select').append('<option id="foo">foo</option>');
$('#foo').focus();

"সম্পাদনা করুন" এর প্রতিক্রিয়া : "এই নির্বাচন বাক্সটি রেডিও বোতামগুলির একটি সেট দ্বারা জনসংখ্যাযুক্ত" এর দ্বারা আপনি কী বোঝাতে চান তা ব্যাখ্যা করতে পারেন? একটি <নির্বাচন> উপাদান (আইনত) থাকতে পারে না <ইনপুট টাইপ = "রেডিও"> উপাদান।


আপনি সহজেই এইচটিএমএল প্রতিস্থাপন করতে পারেন

$('#mySelect')
.html('<option value="whatever" selected>text</option>')
.trigger('change');

আমি পেয়েছি উত্তর ধন্যবাদ, আমি নিম্নলিখিত মত কিছু তৈরি করতে সক্ষম ছিল, যা আমার প্রয়োজন অনুসারে। আমার প্রশ্ন কিছুটা দ্বিধান্বিত ছিল। অনুসরণ করার জন্য ধন্যবাদ। আমার চূড়ান্ত সমস্যাটি আমি পছন্দ করতে চাইলে "নির্বাচিত" সহ সমাধান করা হয়েছিল।

$(function() {
  $('#mySelect').children().remove().end().append('<option selected value="One">One option</option>') ; // clear the select box, then add one option which is selected
  $("input[name='myRadio']").filter( "[value='1']" ).attr( "checked", "checked" ); // select radio button with value 1
  // Bind click event to each radio button.
  $("input[name='myRadio']").bind("click",
                                  function() {
    switch(this.value) {
      case "1":
        $('#mySelect').find('option').remove().end().append('<option selected value="One">One option</option>') ;
        break ;
      case "2":
        $('#mySelect').find('option').remove() ;
        var items = ["Item1", "Item2", "Item3"] ; // Set locally for demo
        var options = '' ;
        for (var i = 0; i < items.length; i++) {
          if (i==0) {
            options += '<option selected value="' + items[i] + '">' + items[i] + '</option>';
          }
          else {
            options += '<option value="' + items[i] + '">' + items[i] + '</option>';
          }
        }
        $('#mySelect').html(options);   // Populate select box with array
        break ;
    } // Switch end
  } // Bind function end
                                 ); // bind end
}); // Event listener end
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>One<input  name="myRadio" type="radio" value="1"  /></label>
<label>Two<input name="myRadio"  type="radio" value="2" /></label>
<select id="mySelect" size="9"></select>


এটা কাজ করবে আশা করি

$('#myselect').find('option').remove()
.append($('<option></option>').val('value1').html('option1'));

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

$('#mySelect').html('<option value="whatever">text</option>');

আরেকটি উদাহরণ:

$('#mySelect').html('
    <option value="1" selected>text1</option>
    <option value="2">text2</option>
    <option value="3" disabled>text3</option>
');

কেন শুধু সাধারণ জাভাস্ক্রিপ্ট ব্যবহার করবেন না?

document.getElementById("selectID").options.length = 0;

মুর্ত্তোর উত্তরের উপর বিল্ডিং, এটি পড়ার এবং বুঝতে একটু সহজ:

$('#mySelect').find('option').not(':first').remove();

একটি নির্দিষ্ট মান সঙ্গে এক ছাড়া সব বিকল্প মুছে ফেলার জন্য, আপনি এই ব্যবহার করতে পারেন:

$('#mySelect').find('option').not('[value=123]').remove();

বিকল্প যোগ করা হবে যদি এই ভাল হবে।


যদি আপনার লক্ষ্য নির্বাচন থেকে সমস্ত বিকল্পগুলি সরাতে হয় তবে প্রথমটি ছাড়া (সাধারণত 'অনুগ্রহ করে একটি আইটেম চয়ন করুন' বিকল্পটি) আপনি ব্যবহার করতে পারেন:

$('#mySelect').find('option:not(:first)').remove();

$("#control").html("<option selected=\"selected\">The Option...</option>");

$("#id option").remove();
$("#id").append('<option value="testValue" >TestText</option>');

কোডের প্রথম লাইন কোনও নির্বাচন বাক্সের সমস্ত বিকল্প মুছে ফেলবে কারণ কোনও বিকল্পের মানদণ্ড উল্লেখ করা হয়নি।

কোডের দ্বিতীয় লাইন নির্দিষ্ট মান ("testValue") এবং পাঠ্য ("TestText") সহ বিকল্প যোগ করবে।


$('#mySelect')
    .empty()
    .append('<option value="whatever">text</option>')
    .find('option:first')
    .attr("selected","selected")
;

$('#mySelect')
    .find('option')
    .remove()
    .end()
    .append('<option value="whatever">text</option>')
    .val('whatever')
;





html-select