Adding values from selected input's into another input

Question

Adding values from selected input's into another input

Navigation

#1 by (3 votes)
#2 by (2 votes)

2

I have for example 4 input , each input has a specific value ex:

*input com os valores
  <input type="radio"  value="1">
  <input type="radio"  value="2">
  <input type="radio"  value="3">
  <input type="radio"  value="4">

*input onde os valores serão adicionados
  <input name="input vazio" type="text"  value="">

And I still have another input , and this input will initially be empty, and depending on whether you select input , the values for the selected input will be added to that other input empty, ex:

<input type="radio"  value="1">  *esse input foi selecionado, logo o input vazio ficará assim

<input name="input vazio" type="text"  value="1">

Suppose I select more than one button, I want you to add the values of both selected buttons, eg

<input type="radio"  value="1">  *esse input foi selecionado
<input type="radio"  value="2">  *esse input foi também foi selecionado
<input type="radio"  value="3">  *esse terceiro também foi selecionado

*logo o input que inicialmente estava vazio ficará assim :     
    <input name="input vazio" type="text"  value="1 2 3">

php html jquery

asked by anonymous 10.10.2014 / 01:07

2 answers

2

You need to listen to .change() of the radio inputs and change the .val() of the text input as this change . I added the my-radio class to these buttons and my-result to the text input:

$('.my-radio').change(function(){
    var preencher = $('.my-result').val() + $(this).val();
    $('.my-result').val( preencher );
});
$('.my-clear').click(function(){
    $('.my-radio').removeAttr('checked');
    $('.my-result').val('');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputclass="my-radio" type="radio" value="1">
<input class="my-radio" type="radio" value="2">
<input class="my-radio" type="radio" value="3">
<input class="my-radio" type="radio" value="4">
<input class="my-result" name="input vazio" type="text" value="">
<br />
<button class="my-clear">limpar</button>

10.10.2014 / 02:02

How to Rotate an Image in the Background? How to show icon in action Bar when item is in overflow?

score 3 · Accepted Answer

You can loop by checking markers and put them in a array , and then apply the join function to put the values in input of text separating them by space, eg:

JSFiddle

HTML

<label><input type="radio"  value="1" /> 1</label>
<label><input type="radio"  value="2" /> 2</label>
<label><input type="radio"  value="3"/> 3</label>
<label><input name="input vazio" type="text"  value=""/></label>

jQuery

$('input[type="radio"]').on('change',function(){
    //array que conterá valores dos inputs marcados
    var a = [];
    //faz loop nos inputs marcados
    $('input[type="radio"]:checked').each(function(){
        a.push($(this).val());
    });
    //coloca os valores no input text separando por espaços
    $('input[type="text"]').val(a.join(' '));

});