1

我只是在使用 Grails 进行照片上传，当我使用 g:form 一切正常时，文件被解析、转换并放入控制器中的会话中，作为响应，我渲染了一个包含照片和一些隐藏输入的模板，因为下一步是裁剪图像并发送回新坐标。

这是“上传表单”代码：

<g:form name="uploadForm" onSuccess="sucess()" enctype="multipart/form-data" url="[controller:ProfileEditor, action:"preview${type.capitalize()}", params:[profilId:profilId]]" >
<input type="file" name="${type}" />
<input type="submit" value="<g:message code="button.${type}.upload" />">
</g:form>
<div id="uploadPreview"></div>
<script type="text/javascript">
    function success() {
        $('#uploadPreview').html(data);
    alert("upload complete");   
}
</script>

我希望将响应插入

('#uploadPreview')

而不是单击提交按钮，浏览器导航到 url-attr 中指定的 url，其中包含带有图像的模板

问题是当我使用 g:formRemote 时没有发布数据，就像 enctype="multipart/form-data" 被完全忽略一样，afaik 通过 ajax 上传文件有点棘手，我们已经用 jquery 解决了这个问题form.js 和它的 ajaxForm，它不需要 formRemote，并且可以在同一页面上上传照片，但我们不能再使用它，它会在 chrome 中随机导致严重的会话问题和脚本错误/ium 和歌剧，所以我必须找到另一种方式

这是简单的 form.js 方式，在上面的代码中 sucessFunction 是：

-       var options =  {
-           beforeSubmit : function() {
-               uploadPreview.empty();
                },  
-           complete : function(xhr) {
-               percent.empty();
-               uploadPreview.html(xhr.responseText);
-           }
-       };
-       $('#uploadForm').ajaxForm(options);

我想知道是否有一个简单的解决方案来使用 formRemote 将文件作为 formData 发布并更新 div，因为在包装表单内进行裁剪的 ajax-foto 上传是常见的事情？

提前致谢

4

0 回答 0