Question

I have 2 radio button groups named group1 and group2 in a form, the value of group 1 and group2 should appear in a the input box name total_size without clicking the submit button of the form

Example:

<form>
<input type="radio" id="m1" name="group1" value=1/>
<input type="radio" id="m2" name="group1" value=2/>

<input type="radio" id="cm1" name="group2" value=1/>
<input type="radio" id="cm2" name="group2" value=2/>


<input type="text" id="total_size" name="total_size" value="RADIO BUTTON GROUP 1 VALUE and RADIO BUTTON GROUP2 VALUE"/>

the format should be group1,group2m

Answer 1

Hi I think you mean something like this.

<form>
<input type="radio" id="m1" name="group1" value='1' />
<input type="radio" id="m2" name="group1" value='2' />

<input type="radio" id="cm1" name="group2" value='1' />
<input type="radio" id="cm2" name="group2" value='2' />


<input type="text" id="total_size" name="total_size" value="RADIO BUTTON GROUP 1 VALUE and RADIO BUTTON GROUP2 VALUE"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
(function($) {
    $(function() {
        $('input[type="radio"]').click(function(e){
            value = $("input[name=group1]:checked").val() + ',' + $("input[name=group2]:checked").val();
            $('#total_size').val(value);
        });
    });
})(jQuery);
</script>