Change a hidden input fields value when a radio button is selected

Question

I want to change the value of an hidden input field each time a user checks a radio button. This is how my HTML looks like. ``` ``` Now I want that each time I check a radio button, the value of that radio button becomes also the value of the hidden input field. Does anybody knows how to do that? Here is what I have so far. ``` $('input[name="radbut"]').click(function() { console.log(this.value); $('ZAAL_NAME').val(this.value); }); ``` Could anybody help ? Kind regards, Steaphann

Accepted Answer

Your inline `onclick` handler won't work since you didn't include parentheses: it needs to be `onclick="change()"` to actually call your function. But you should change it to `onclick="change(this);"` to pass a reference to the clicked button to your function, then:

```
function change(el){
    $("#ZAAL_NAME").val(el.value) ;
}
```

Also you jQuery selector need a # to select by id.

Better though would be to remove the inline `onclick` from your markup and do it like this:

```
$('input[name="zaal_ID"]').click(function() {
    $('#ZAAL_NAME').val(this.value);
});
```

The latter would need to be in a document ready handler and/or in a script block that appears after your radio buttons in the page source.

Note: when getting the value of the clicked element you can say `$(el).val()` or `$(this).val()` (depending on which of the two functions you are looking at), but given that `el` and `this` are references to the DOM element you can just get its value property directly with `el.value` or `this.value`.

Change a hidden input fields value when a radio button is selected

Solution

Problem