Question

I am using tomahawk library for browse button in my project.

Browse button code.

<td><t:inputFileUpload id="file" value="#{sampleService.file}" 
            valueChangeListener="#{sampleService.file}" /></td>

Radio Button Code

<td><input type="radio" /> This is compulsory</td>

I want to put a validation here,If the user has not checked the radio button,
it should display a message to check radio button.

thanks for any help

Answer 1

Give the radio button a fixed id and check its checked state in the onclick of the file field and if it’s false, then display a message (alert?) and return false to block the browse button.

E.g.

<t:inputFileUpload id="file" value="#{sampleService.file}" valueChangeListener="#{sampleService.file}" 
    onclick="if (!document.getElementById('compulsory').checked) { alert('Please check radio button'); return false; }"
/>
<input type="radio" id="compulsory" /> This is compulsory

You could also wrap it in a JS function:

function checkCompulsory() {
    if (!document.getElementById('compulsory').checked) {
        alert('Please check radio button'); 
        return false;
    } else {
        return true;
    }
}

with

<t:inputFileUpload id="file" value="#{sampleService.file}" valueChangeListener="#{sampleService.file}" 
    onclick="return checkCompulsory()"
/>
<input type="radio" id="compulsory" /> This is compulsory