Passing Parameters from Multiple Checkboxes to a Jquery Variable

Asked

Viewed 992 times

1

Hello, I would like to know how I do to take the values of the value field of several checkboxes selected and save in a variable jquery separated by commas, but without using the id field, since it is already being used in a label.

2 answers

3


You can just use $(':checked') as selector or be more explicit and use $('input[type=checkbox]:checked').

To move to an array you can use the .get()combined with .map() which converts a jQuery collection into a native array and then fetches the value to each element/object in that array. To pass to string (I think that’s what you want) just do .toString() or .join(',');

var valores = $(':checked').get().map(el => el.value).join(',');
console.log(valores);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" value="a">
<input type="checkbox" value="b">
<input type="checkbox" value="c" checked="true">
<input type="checkbox" value="d" checked ="true">

  • But this is not dynamic is it? because from what I saw when executing the code it already does the verification of which is checked, but if I check other checkboxes it does not change the result..

  • @Alfredolima, can you explain more about what you call being dynamic? or explain what you’d like the show to do.

  • is that for example I ran your code, and it has already returned the result below the ones marked as checked="true" but when I click on another checkbox it does not change for me the result below, it keeps displaying the parameters you passed via html

  • @Alfredolima in this case you must have an event headset . on('change' but I can’t guess that from your question. I’ll add an example later...

  • Beauty was worth! I wait.

  • @Alfredolima is what you’re looking for? https://jsfiddle.net/eudjuctv/

  • That’s right, but there’s a way you can give me a boost because in the template I’m using here it’s not working, already in jsfiddle it worked, access there doing favor and give a look for me? http://www.acaiamarena.com.br/atualizacao

Show 2 more comments

1

You have several ways to work this.

To get the check box value you can do the following

$("input[type='checkbox']").val();

or if you set a class or id this way

$('#check_id').val();
$('.check_class').val();

However, this will return the same value if it is checked or not, this can be confusing as it is different to the form behavior presented. check if this checkout or not you use the following template:

if ($('#check_id').is(":checked"))
{
  // it is checked
}

in your case this function below should solve

 $(".checkboxClass").click(function(){
  var selectedCountry = new Array();
  $(".checkboxClass:checked").each(function(){

    selectedCountry.push($(this).val());
  });
  $(".exibirSelecao").html(selectedCountry.join('<br>'));
});

vc must put the class . checkboxClass in all checkbos that want to get the value

create a div with the displaySelect

  • In mine it did not work, and returned this error here in the console "jQuery is not defined" goes up what can be?

  • trade Jquery for $

  • It still didn’t work, take a look at me here to see more or less how is my code... https://jsfiddle.net/gjbe7bgs/

  • https://jsfiddle.net/gjbe7bgs/1/

  • Look I fixed the Cod

Browser other questions tagged

You are not signed in. Login or sign up in order to post.