图片上传4-bug修复

bug1:显示图片的时候,需要判断url是否为空

<#if photo.url != null>
<img
id="${photo.id}-img" src="${zhaorongbaoFileUrl}/${photo.url}" path="${photo.url}"
height="200px">

<#else>
<img
id="${photo.id}-img" src="" path=""
height="200px">
</#if>

如果不判断,url为空的时候,图片找不到,一个×很影响心情。

bug2:保存的时候,获得图片的id,需要判断newid是否为null。如果不为null,用newid,如果为null,使用id。

也就是说,传给后端的id存在3种情况:

a.增加按钮,默认生成的是 当前时间的毫秒数

b.默认列表显示,后台数据库中的id

c.增加按钮之后,上传了图片,从后台数据库获得的

function bindSaveEvent(){
console.log("bindSaveEvent");
$("#save").on("click", function() {
var trs=$(".tr");
var photos = new Array();
$.each(trs,function(i,n){
var tr = $(trs[i]);
var photo ={};
//newid是数据库中的id
var id=tr.attr("id");
var newid=tr.attr("newid");
photo.id=null;
//优先使用newid
if(newid != null){
    photo.id=newid;
}else if(id != null){
  photo.id=id;
}

}

bug3:PhotoBean 的toAdd可能存在。当前端增加一条记录,但是不上传图片的时候,这条记录仍然是合法的,这个时候就需要在数据库中插入一条记录了。

class PhotoBean {
// 将要删除的,通常是数据库中的
public List<Photo> toDelete;
// 将要更新的,都在数据库中,部分最新内容来源于web前端
public List<Photo> toUpdate;
// 将要增加的,由于上传图片的时候都已经插入了,这个时候可以忽略了,但是存在增加一条记录,但不上传图片的情况
public List<Photo> toAdd;
}

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-07-30 04:10:14

图片上传4-bug修复的相关文章

jquery 图片上传本地预览V1.2

基于JQUERY扩展,图片上传预览插件 目前兼容浏览器(IE 谷歌 火狐) 不支持safari 代码进行小小的压缩 如果看源码 自己解压就行了 版本已升级  修复jquery版本问题  支持任意jquery版本 代码在线演示地址:http://jquery.decadework.com/ 插件下载地址:http://jquery.decadework.com/plugin/uploadPreview.zip 标签: <无> 代码片段(3)[全屏查看所有代码] 1. [代码]uploadPrev

图片上传时预览插件

html代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script src="uploadView.js" type="text/javascript"></script> <script> window.

ueditor1.4.3 springmvc图片上传

ueditor:百度富文本编辑器,地址:ueditor.baidu.com 版本选择,之所以选择1.4.3,是因为ueditor 1.4.2才修复在bootstrap环境下图片拖拽异常,看到1.4.3也修复了不少的bug,没敢使用1.4.2,稍微看了下源码,1.4.3里面很多todo注释,ueditor一直在改进,不太成熟,既然这么多bug,为什么要选ueditor做富文本编辑?这个看项目组大神了,小喽啰没法做技术引入,如果有选择,不太建议用ueditor商用,bug比较多,当然使用简单也是个有

百度上传工具webuploader,图片上传附加参数

项目中需要上传视频,图片等资源.最先做的是上传图片,开始在网上找了一款野鸡插件,可以实现图片上传预览(无需传到后台).但是最近这个插件出了莫名的问题,不易修复,一怒之下,还是决定找个大点的,靠谱的插件吧.加之上传视频就是用的webuploader,所以上传图片也理所当然选它了. 插件初始化,js引用什么的,官方文档上都写的比较清楚,建议直接去官方api去看 http://fex.baidu.com/webuploader/getting-started.html#图片上传 官方api上值给出了上

JavaScript 图片上传预览效果

图片上传预览是一种在图片上传之前对图片进行本地预览的技术.使用户选择图片后能立即查看图片,而不需上传服务器,提高用户体验.但随着浏览器安全性的提高,要实现图片上传预览也越来越困难.不过群众的智慧是无限的,网上已经有很多变通或先进的方法来实现.例如ie7/ie8的滤镜预览法,firefox 3的getAsDataURL方法.但在opera.safari和chrome还是没有办法实现本地预览,只能通过后台来支持预览.在研究了各种预览方法后,作为总结,写了这个程序,跟大家一起分享.上次写的简便无刷新文

vuejs开发组件分享之H5图片上传、压缩及拍照旋转的问题处理

一.前言 三年.net开发转前端已经四个月了,前端主要用webpack+vue,由于后端转过来的,前端不够系统,希望分享下开发心得与园友一起学习. 图片的上传之前都是用的插件(ajaxupload),或者传统上传图片的方式,各有利弊:插件的问题是依赖jq并且会使系统比较臃肿,还有传统的web开发模式 前后端偶尔在一起及对用户体验要求低,现在公司采用webpack+vue+restfullApi开发模式 前后端完全分离,遵从高内聚,低偶尔的原则,开发人员各司其职,一则提升开发效率(从长期来看,短期

2014-06-23图片上传处理

1.       将字符串转换为Guid的形式 System.Guid categoryId = newGuid(context.Request["CategoryId"]);//将字符串转换为Guid的形式 2.定义DataRow /*----------------------定义DataRow并赋值-------------------------*/ DataTable dt = newDataTable(); dt.Columns.Add(newDataColumn(&quo

图片上传-下载-删除等图片管理的若干经验总结3-单一业务场景的完整解决方案

这次完整地介绍图片上传的完整解决方案,如有bug,后续再补充. 一.图片表 CREATE TABLE `photo` ( `id` bigint(10) unsigned NOT NULL AUTO_INCREMENT, `bizid` bigint(11) NOT NULL DEFAULT '-1' COMMENT '业务id,比如项目的id', `cover` int(11) DEFAULT '0' COMMENT '1:是,0:不是', `sort` int(11) DEFAULT '0'

megapix-image插件 使用Canvas压缩图片上传

<!DOCTYPE html > <html> <head> <title>通过Canvas及File API缩放并上传图片</title> <script src="/Scripts/Jquery/jquery-1.8.3.min.js" type="text/javascript"></script> <script src="/Scripts/MegaPixIm

推荐ajaxfilemanager for tiny_mce 比较完善的tiny_mce编辑器的图片上传及图片管理插件PHP版 支持中文

tiny_mce编辑器,我觉得挺简洁.好用的,但就是图片上传的插件是收费的,而且网上找了半天也没有找到开源好用的上传插件. 不过功夫不负有心人,终于还就被我找到一款相当满意的插件. 这个插件的名字叫ajaxfilemanager 官方网址是http://www.phpletter.com/DOWNLOAD/ Tinymce Ajax File and Image Manager Tinymce Ajax File and Image Manager Version 1.0 Final Proje