একটি অ্যারেতে নির্বাচিত সমস্ত চেকবাক্স পেয়ে যাওয়া


168

সুতরাং আমার কাছে এই চেকবক্সগুলি রয়েছে:

<input type="checkbox" name="type" value="4" />
<input type="checkbox" name="type" value="3" />
<input type="checkbox" name="type" value="1" />
<input type="checkbox" name="type" value="5" />

ইত্যাদি। এর মধ্যে প্রায় 6 টি রয়েছে এবং হ্যান্ড-কোডড (অর্থাত্ একটি ডিবি থেকে আনা হয়নি) তাই তারা কিছু সময়ের জন্য একই থাকে।

আমার প্রশ্ন হ'ল আমি কীভাবে তাদের সমস্তকে একটি অ্যারেতে (জাভাস্ক্রিপ্টে) পেতে পারি, তাই $.postজ্যাকুয়েরি ব্যবহার করে একটি এজেএক্স অনুরোধ করার সময় আমি সেগুলি ব্যবহার করতে পারি ।

কোন চিন্তা?

সম্পাদনা: আমি কেবলমাত্র নির্বাচিত চেকবক্সগুলি অ্যারেতে যুক্ত করা চাই



যদিও অন্য প্রশ্ন নতুন এবং এই আরো এক জনপ্রিয়, অন্যটি আরো ভালো এবং সংক্ষিপ্ত উত্তর সংগ্রহ আছে (কৌশল এখানে সহ, প্লাস কিছু)।
জেসন সি

উত্তর:


331

ফর্ম্যাট করা:

$("input:checkbox[name=type]:checked").each(function(){
    yourArray.push($(this).val());
});

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


1
এবং অ্যারে থেকে মান অপসারণ করতে চেকবক্সটি চেক করা না থাকলে কী করবেন
যুবিন প্যাটেল

@ যুবিনপ্যাটেল আপনাকে এই কোডের আগে অ্যারে পুনরায় সেট করতে হবে। yourArray = []
আরআরকে

11
আপনি এর mapপরিবর্তে তত্ক্ষণাত ব্যবহার করে আপনার অ্যারের সংজ্ঞা দিতে পারেন each:var yourArray = $("input:checkbox[name=type]:checked").map(function(){return $(this).val()}).get()
দুভরাই

3
function get_selected_checkboxes_array(){ var ch_list=Array(); $("input:checkbox[type=checkbox]:checked").each(function(){ch_list.push($(this).val());}); return ch_list; }
এম

50
var chk_arr =  document.getElementsByName("chkRights[]");
var chklength = chk_arr.length;             

for(k=0;k< chklength;k++)
{
    chk_arr[k].checked = false;
} 

6
আমি উপরের কোডটি বোঝার সাথে সাথে এটি সমস্ত চেকবাক্সগুলির মাধ্যমে পুনরাবৃত্তি করে এবং সেগুলি চেক করে না। এই উত্তরটি প্রশ্নের সাথে কীভাবে যুক্ত?
টেরিট

2
এটি কেবল চেকবাক্সগুলির মধ্য দিয়ে লুপ করে এবং এগুলি চেক করে না। সঠিক উত্তরের জন্য, ভ্যানিলাজেএস-এ, নীচে জাহিদ উল্লাহর উত্তরটি দেখুন।
jmknoll

2
কিভাবে এই প্রশ্নের উত্তর দেয়? এটি যা জিজ্ঞাসিত হয়েছে তার সাথে সম্পূর্ণ সম্পর্কহীন কিছু করে। কেন এত উপায়ে আছে? আমি কি কিছু মিস করছি, বা লোকেরা এটি উত্থাপিত করার পরে প্রশ্নটি সম্পাদিত হয়েছিল?
শুভম চৌধুরী চৌধুরী

46

খাঁটি জেএস

যারা jQuery ব্যবহার করতে চান না তাদের জন্য

var array = []
var checkboxes = document.querySelectorAll('input[type=checkbox]:checked')

for (var i = 0; i < checkboxes.length; i++) {
  array.push(checkboxes[i].value)
}

5
সবসময় একটি ভ্যানিলা জেএস উত্তর পছন্দ।
ফর্মিকিনি

39

আমি এটি পরীক্ষা করিনি তবে এটি কাজ করা উচিত

<script type="text/javascript">
var selected = new Array();

$(document).ready(function() {

  $("input:checkbox[name=type]:checked").each(function() {
       selected.push($(this).val());
  });

});

</script>

অ্যারেতে মান যুক্ত করার জন্য চাপ দিন তবে আনচেক থেকে কী সরিয়ে ফেলবেন?
যুবিন প্যাটেল

24

এই কৌতুক করতে হবে:

$('input:checked');

আমি মনে করি না যে আপনার কাছে এমন অন্যান্য উপাদান রয়েছে যা চেক করা যেতে পারে তবে আপনি যদি এটি করেন তবে আপনাকে আরও নির্দিষ্ট করে তুলতে হবে:

$('input:checkbox:checked');

$('input:checkbox').filter(':checked');

14

MooTools 1.3 এ (লেখার সময় সর্বশেষ):

var array = [];
$$("input[type=checkbox]:checked").each(function(i){
    array.push( i.value );
});

7
প্রশ্নের বয়স বা সমাধানের প্রকৃতি প্রাসঙ্গিক বলে বুঝতে পারিনি।
লিগি

4
কারণ MooTools ব্যবহার করে একই সমস্যার উত্তর খুঁজতে গিয়ে আমি এই প্রশ্নটি পেয়েছি।
লিগি

নোট করুন এই উত্তরটি jQuery নয়, MooTools 1.3 এর সাথে সম্পর্কিত।
লিগি

13

আপনি যদি ভ্যানিলা জেএস ব্যবহার করতে চান তবে আপনি @ জাহিদ-উল্লাহর মতো এটি করতে পারেন তবে লুপটি এড়িয়ে চলেছেন:

  var values = [].filter.call(document.getElementsByName('fruits[]'), function(c) {
    return c.checked;
  }).map(function(c) {
    return c.value;
  });

ES6 এ একই কোডটি আরও ভালভাবে দেখায়:

var values = [].filter.call(document.getElementsByName('fruits[]'), (c) => c.checked).map(c => c.value);


12

জাভাস্ক্রিপ্টে এটি এর মতো হবে (ডেমো লিঙ্ক) :

// get selected checkboxes
function getSelectedChbox(frm) {
  var selchbox = [];// array that will store the value of selected checkboxes
  // gets all the input tags in frm, and their number
  var inpfields = frm.getElementsByTagName('input');
  var nr_inpfields = inpfields.length;
  // traverse the inpfields elements, and adds the value of selected (checked) checkbox in selchbox
  for(var i=0; i<nr_inpfields; i++) {
    if(inpfields[i].type == 'checkbox' && inpfields[i].checked == true) selchbox.push(inpfields[i].value);
  }
  return selchbox;
}   

12

ES6 সংস্করণ:

const values = Array
  .from(document.querySelectorAll('input[type="checkbox"]'))
  .filter((checkbox) => checkbox.checked)
  .map((checkbox) => checkbox.value);


5

অস্থায়ী ভেরিয়েবলের প্রয়োজন ছাড়াই বিশুদ্ধ জাভাস্ক্রিপ্ট:

Array.from(document.querySelectorAll("input[type=checkbox][name=type]:checked")).map(e => e.value)

ভ্যানিলা জেএস ব্যবহার করে সবচেয়ে সংক্ষিপ্ত সমাধান
এম মুফতি


3

চেকবাক্সের জন্য মান যুক্ত করতে এবং চূড়ান্ত করার সময় মানটি বিয়োগফলকে বিয়োগ করে

$('#myDiv').change(function() {
  var values = 0.00;
  {
    $('#myDiv :checked').each(function() {
      //if(values.indexOf($(this).val()) === -1){
      values=values+parseFloat(($(this).val()));
      // }
    });
    console.log( parseFloat(values));
  }
});
<div id="myDiv">
  <input type="checkbox" name="type" value="4.00" />
  <input type="checkbox" name="type" value="3.75" />
  <input type="checkbox" name="type" value="1.25" />
  <input type="checkbox" name="type" value="5.50" />
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>


আপনার উত্তরে কিছুটা ব্যাখ্যা যোগ করুন। খাঁটি কোড উত্তরগুলি সাধারণত কার্যকর হয় না।
sjaustirni

3

আধুনিক ব্রাউজারগুলিতে ভ্যানিলা জেএসের সাথে এটি করার আর একটি উপায় (আইআই সমর্থন নয়, এবং দুঃখের বিষয় লেখার সময় কোনও আইওএস সাফারি সমর্থন নয়) ফর্ম্যাডাটা.জেটএল () এর সাথে রয়েছে :

var formdata   = new FormData(document.getElementById("myform"));
var allchecked = formdata.getAll("type"); // "type" is the input name in the question

// allchecked is ["1","3","4","5"]  -- if indeed all are checked

1

জ্যাকুরি ব্যবহার করা হচ্ছে

আপনাকে কেবল প্রতিটি ইনপুটে ক্লাস যুক্ত করতে হবে, আমি অবশ্যই "উত্স" ক্লাস যুক্ত করেছি আপনি অবশ্যই এটি পরিবর্তন করতে পারেন

<input class="source" type="checkbox" name="type" value="4" />
<input class="source" type="checkbox" name="type" value="3" />
<input class="source" type="checkbox" name="type" value="1" />
<input class="source" type="checkbox" name="type" value="5" />

<script type="text/javascript">
$(document).ready(function() {
    var selected_value = []; // initialize empty array 
    $(".source:checked").each(function(){
        selected_value.push($(this).val());
    });
    console.log(selected_value); //Press F12 to see all selected values
});
</script>

1

এটা ব্যবহার কর:

var arr = $('input:checkbox:checked').map(function () {
  return this.value;
}).get();

0

যদি আপনি বাটন ক্লিক বা সন্নিবেশ চালানোর জন্য কিছু ব্যবহার করেন তবে ইতিমধ্যে অ্যারেতে থাকা মানগুলি রোধ করতে ব্লক হলে মন্তব্য করুন

$('#myDiv').change(function() {
  var values = [];
  {
    $('#myDiv :checked').each(function() {
      //if(values.indexOf($(this).val()) === -1){
      values.push($(this).val());
      // }
    });
    console.log(values);
  }
});
<div id="myDiv">
  <input type="checkbox" name="type" value="4" />
  <input type="checkbox" name="type" value="3" />
  <input type="checkbox" name="type" value="1" />
  <input type="checkbox" name="type" value="5" />
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>


0

আপনি এরকম কিছু চেষ্টা করতে পারেন:

$('input[type="checkbox"]').change(function(){
       var checkedValue = $('input:checkbox:checked').map(function(){
                return this.value;
            }).get();         
            alert(checkedValue);   //display selected checkbox value     
 })

এখানে

$('input[type="checkbox"]').change(function() call when any checkbox checked or unchecked, after this
$('input:checkbox:checked').map(function()  looping on all checkbox,

0

এখানে একই সমস্যার জন্য আমার কোডটি এখানেও কেউ চেষ্টা করতে পারেন। jQuery

<script>
$(document).ready(function(){`
$(".check11").change(function(){
var favorite1 = [];        
$.each($("input[name='check1']:checked"), function(){                    
favorite1.push($(this).val());
document.getElementById("countch1").innerHTML=favorite1;
});
});
});
</script>

0

function selectedValues(ele){
  var arr = [];
  for(var i = 0; i < ele.length; i++){
    if(ele[i].type == 'checkbox' && ele[i].checked){
      arr.push(ele[i].value);
    }
  }
  return arr;
}


দরকারী উত্তরের জন্য এই প্রতিক্রিয়াটি বাড়ানো দরকার। কেন এটি প্রশ্নের উত্তর is
জেরোইন হাইয়ার

স্ট্যাক ওভারফ্লোতে আপনাকে স্বাগতম এবং আপনার অবদানের জন্য ধন্যবাদ! যদি আপনি এই গাইডটি পড়েন তবে কীভাবে একটি ভাল উত্তর লিখতে হবে এবং সেই অনুযায়ী আপনার উত্তরটি সামঞ্জস্য করা ভাল would ধন্যবাদ!
ডেভিড

0
var array = []
    $("input:checkbox[name=type]:checked").each(function(){
        array.push($(this).val());
    });
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.