Yii 在iframe中预览form提交的图片…

来源:互联网 发布:java log4j使用 编辑:程序博客网 时间:2024/05/21 12:40
在网页上给手机网页修改一些图片,并且在网上能够尽可能的预览手机上变换图片后的效果,预览之后也可以保存图片。为了尽量逼真手机效果,所以在页面中使用一个iframe,src就是手机上可以看到的相似的页面。

方法就是:
  1. 在网页中加入一个iframe,src="portal/preview",portal是controller,preview是view。在preview中显示图片
  2. 加入一个form,form原来的action是处理保存图片的路由"portal/design",form的"enctype"一定要设为"multipart/form-data"

以及多个input的"file"元素,用来选择图片
需求:
  1. 选择文件后,iframe中直接看到预览的图片效果
遇到的问题和解决方案:
在file的onchang事件触发,图片开始上传到一个预览的临时文件夹下,但是:
  1. ajax中不允许上传文件,原来form的action是保存图片的路由,所以可以直接改变form提交的action为iframe的src,也就是"portal/preview"。这样iframe接受提交后也会自动刷新。
  2. 在portal中的"actionPreview"中renderPartial的就是预览preview的视图,但是在默认情况下,每次处理完预览图片后,页面会打开一个新的,而不是刷新iframe,所以要添加一个"target":"myframe"

  1. jQuery提交form使用代码$("#fileForm").submit();
0 0
原创粉丝点击