jquery - Grails g:uploadForm重定向

我有一个g:uploadForm出现在模式对话框中。
在我提交g:uploadForm之后，它开始上传我的文件，但是在完成之后，它尝试转到upload.jsp并没有找到它。相反，我想要的是模式对话框在文件完成上传后不关闭。我该如何阻止表单出现的模态的关闭。我认为真正的问题是文件上传后，如何抑制浏览器查找upload.jsp。相反，我希望它保留在用于浏览然后上传文件的模式下。

这是上传表格:

<g:uploadForm class = "uploaderForm" 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>
                        <button id = "submFile" type="button">Upload</button>
                        <button id = "cancel1" class = "close" type="button"> Cancel </button>
                    </div>
                    <div id ="uploadErrors"><div id="progressbar"><div class="progress-label" style ="color: black;">Loading...</div></div></div>
                </g:uploadForm>

这是提交它的按钮的javascript:

$("#submFile").click(function () {
    if ($("#chseFile").val() == "") {
        $("#uploadErrors").html("<span class='text'>You must select a file to upload.</span>");
        $("#uploadErrors").show();
        $("#uploadErrors .text").fadeOut(3000);
        }
    else if (getCheckedValue(document.getElementsByName('dataTypegrp')) == "") {
        $("#uploadErrors").html("<span class='text'>You must select a data type to upload.</span>");
        $("#uploadErrors").show();
        $("#uploadErrors .text").fadeOut(3000);
    }
    else {
        $("#progressbar").show();
        $("#progressbar").progressbar({
            value: false,
            change: function() {
                $(".progress-label").text( $("#uploadErrors").progressbar( "value" ) + "%" );
            },
            complete: function() {
                $(".progress-label").text( "Complete!" );
            }
        });
        $(".uploaderForm").submit();
}
}

最佳答案

为了在模式中使用g:uploadForm来完成此操作，您将需要实现将表单发布到iframe。

这很简单。只需将iframe添加到您的模式/页面，然后在target上设置form以使其与iframe的名称匹配即可。例如:

<g:uploadForm name="someForm"
    controller="myController"
    action="saveUpload
    class="form-horizontal"
    role="form"
    target="hidden-upload-frame">
...
</g:uploadForm>
...
<iframe id="hidden-upload-frame"
    name="hidden-upload-frame"
    style="display: none;">
</iframe>

如果您需要页面/模式来响应要上传的文件，则controller可以将其呈现为iframe(例如javascript / jquery)。

关于jquery - Grails g:uploadForm重定向，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24224647/