Grails: g:uploadForm inside a modal div supress submission

Question

I have a g:uploadForm that appears inside of a modal dialog. I don't want it to close if no file is chosen for upload and the user presses the Upload button, instead, I want it to display an error like "please choose a file". Currently it does close and I was wondering if there is any way to suppress this. There are a few radio button on this form also in a group and I also don't want the form to close if no choice is made from the radio button group. Currently it does close if no choice is made. Here is my form as it is currently:

<div class="modal" id="promptUpload">
            <h3></h3>
            <div id = "uploadborder">
                <g:uploadForm action="upload">
                    <div id = "fileType">
                        <p><u>File Type</u></p>
                        <label for="excelFile">Excel:</label><g:radio id = "excelFile" name="fileTypegrp" value="1" checked="true"/><br>
                        <label for="textFile">Text File(delimited):</label><g:radio id = "textFile" name="fileTypegrp" value="2" disabled="true"/><br>
                        <label for="xmlFile">XML:</label><g:radio id = "xmlfile" name="fileTypegrp" value="3" disabled="true"/>
                    </div>
                    <div id = "dataType">
                        <p><u>Data Type</u></p>
                        <label for="accData">Account Data:</label><g:radio id = "accData" name="dataTypegrp" value="1"/><br>
                        <label for="entData">Entity Data:</label><g:radio id = "entData" name="dataTypegrp" value="2"/><br>
                        <label for="indData">Individual Data:</label><g:radio id = "indData" name="dataTypegrp" value="3"/><br>
                    </div>  
                    <div id = "uploaderfield">
                        <input id = "chseFile" type="file" name="file"/><br>
                        <input id = "submFile" type="submit" value="Upload" />
                        <button id = "cancel1" class = "close" type="button"> Cancel </button>
                    </div>
                </g:uploadForm>

I am using jQuery UI Tools to bring up this modal which contains the form. I've notice that if I change my upload button to simply:

<button id = "submFile"></button>

it still closes the modal and submits the form. That I find strange. The reason I included the radio buttons in my g:uploadForm is because I need their values in my params.

Answer 1

You have to set the type = button to supress the form submission.