193 lines
9.3 KiB
HTML
193 lines
9.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Load Form Data - jQuery EasyUI Demo</title>
|
|
<link rel="stylesheet" type="text/css" href="/static/safesite/themes/default/easyui.css">
|
|
<link rel="stylesheet" type="text/css" href="/static/safesite/themes/icon.css">
|
|
<link rel="stylesheet" type="text/css" href="/static/safesite/demo/demo.css">
|
|
<script type="text/javascript" src="/static/safesite/jquery.min.js"></script>
|
|
<script type="text/javascript" src="/static/safesite/jquery.easyui.min.js"></script>
|
|
</head>
|
|
<body class="easyui-layout">
|
|
<div data-options="region:'east',split:true" title="评估审核" style="width:30%;">
|
|
<ul class="easyui-tree" data-options="url:'',method:'get',animate:true,dnd:true"></ul>
|
|
</div>
|
|
<div data-options="region:'center'" title="隐患详情" style="width:70%;height:100%;padding:5px 15px;">
|
|
<form id="ff" method="post" enctype="multipart/form-data">
|
|
<p style="font-weight: bold;">发起详情</p>
|
|
<div style="margin-bottom:20px">
|
|
<select class="easyui-combobox" name="yhdj" label="隐患等级" style="width:100%"><option value="0">无隐患</option><option value="1" selected="selected">一般隐患</option><option value="2">重大隐患</option></select>
|
|
|
|
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhlx" style="width:100%" data-options="label:'隐患类型:',required:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhlb" style="width:100%" data-options="label:'隐患类别:',required:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhfxsj" style="width:100%" data-options="label:'发现时间:',required:true">
|
|
|
|
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhfxbm" style="width:100%" data-options="label:'发现部门:',required:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhfxr" style="width:100%" data-options="label:'发现人:',required:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="jclx" style="width:100%" data-options="label:'检查类型:',required:true">
|
|
|
|
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhpg" style="width:100%" data-options="label:'隐患评估:',required:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhdd" style="width:100%" data-options="label:'隐患地点:',required:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yhms" style="width:100%;height:60px" data-options="label:'隐患描述:',multiline:true">
|
|
</div>
|
|
<div style="margin-bottom:20px" id="addImage"> </div>
|
|
<div style="margin-bottom:20px">
|
|
<label>隐患图片:</label> <!--<input type="button" value="上传图片" onclick="f.click()" class="btn_mouseout"/><br>
|
|
<p><input type="file" id="f" name="f" onchange="sc(this);" style="display:none" accept="image/*"/></p>--> <input type="file" id="file" name="" accept="image/*"/><span id="zzsc" style="color:blue;display:none" >正在上传中。。</span>
|
|
|
|
|
|
</div>
|
|
<p style="font-weight: bold;">整改详情</p>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="zgqx" style="width:100%" data-options="label:'整改期限:',required:true">
|
|
|
|
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="zgbm" style="width:100%" data-options="label:'整改部门:',required:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="zgr" style="width:100%" data-options="label:'整改负责人:',required:true">
|
|
</div>
|
|
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yxfx" style="width:100%;height:60px" data-options="label:'原因分析:',required:true,multiline:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="yxfx" style="width:100%;height:60px" data-options="label:'整改措施:',required:true,multiline:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<input class="easyui-textbox" name="zghtp" style="width:100%;height:60px" data-options="label:'整改后图片:',multiline:true">
|
|
</div>
|
|
<div style="margin-bottom:20px">
|
|
<label for="accept" class="textbox-label">Accept:</label>
|
|
<input id="accept" type="checkbox" name="accept" value="true">
|
|
</div>
|
|
</form>
|
|
<div style="text-align:center;padding:5px 0">
|
|
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()" style="width:80px">Submit</a>
|
|
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()" style="width:80px">Clear</a>
|
|
</div>
|
|
<div style="margin:20px 0;">
|
|
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="loadLocal()">LoadLocal</a>
|
|
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="loadRemote()">LoadRemote</a>
|
|
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()">Clear</a>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
document.getElementById('file').onchange = function() {
|
|
var imgFile = this.files[0];
|
|
var src=window.URL.createObjectURL(imgFile)
|
|
var formData = new FormData();
|
|
formData.append("yhimg", imgFile);
|
|
$("#zzsc").show();
|
|
$.ajax({
|
|
|
|
url: "/uploadimg/",
|
|
type: "POST",
|
|
data: formData,
|
|
/**
|
|
*必须false才会自动加上正确的Content-Type
|
|
*/
|
|
contentType: false,
|
|
/**
|
|
* 必须false才会避开jQuery对 formdata 的默认处理
|
|
* XMLHttpRequest会对 formdata 进行正确的处理
|
|
*/
|
|
processData: false,
|
|
|
|
success: function (data) {
|
|
if (data.code == 1) {
|
|
//var src=window.URL.createObjectURL(imgFile)
|
|
$("#zzsc").hide();
|
|
//var img = $('<li><img title="点击放大" onclick="imgclick()" style="width: 100%; max-width: 120px; float: left;" src="' + src + '"/><div style="text-align:center;"><a href='javascript:void(0);' onclick="removep(this)">删除</a></div></li>');
|
|
//$("#addImage").append(img);
|
|
$("#addImage").append('<div><img width="120" height="120" src="' + src + '"/><a href="#" onclick="removep(this)" >删除</a></div>');
|
|
}
|
|
if (data.code == "0") {
|
|
$("#zzsc").hide();
|
|
$("#zzsc").text('上传失败！');
|
|
}
|
|
//$("#imgWait").hide();
|
|
},
|
|
//error: function () {
|
|
//alert("上传失败！");
|
|
//$("#imgWait").hide();
|
|
//}
|
|
});
|
|
//var fr = new FileReader();
|
|
//fr.onload = function() {
|
|
|
|
//};
|
|
// fr.readAsDataURL(imgFile);
|
|
};
|
|
<!-- function sc(){ -->
|
|
<!-- $("#addImage").append('<span>正在上传中。。</span>'); -->
|
|
<!-- var formData = new FormData(); -->
|
|
<!-- formData.append("yhimg", document.getElementById("f").files[0]); -->
|
|
<!-- alert(formData); -->
|
|
<!-- $.ajax({ -->
|
|
<!-- url: "/uploadimg/", -->
|
|
<!-- type: "POST", -->
|
|
<!-- data: formData, -->
|
|
<!-- /** -->
|
|
<!-- *必须false才会自动加上正确的Content-Type -->
|
|
<!-- */ -->
|
|
<!-- contentType: false, -->
|
|
<!-- /** -->
|
|
<!-- * 必须false才会避开jQuery对 formdata 的默认处理 -->
|
|
<!-- * XMLHttpRequest会对 formdata 进行正确的处理 -->
|
|
<!-- */ -->
|
|
<!-- processData: false, -->
|
|
<!-- success: function (data) { -->
|
|
<!-- if (data.status == "true") { -->
|
|
<!-- alert("上传成功！"); -->
|
|
<!-- } -->
|
|
<!-- if (data.status == "error") { -->
|
|
<!-- alert(data.msg); -->
|
|
<!-- } -->
|
|
<!-- //$("#imgWait").hide(); -->
|
|
<!-- }, -->
|
|
<!-- error: function () { -->
|
|
<!-- alert("上传失败！"); -->
|
|
<!-- //$("#imgWait").hide(); -->
|
|
<!-- } -->
|
|
<!-- }); -->
|
|
<!-- }); -->
|
|
<!-- }); -->
|
|
<!-- } -->
|
|
function removep(o){
|
|
$this = $(o);
|
|
$this.closest('div').remove();
|
|
}
|
|
function loadRemote(){
|
|
$('#ff').form('load', 'form_data1.json');
|
|
}
|
|
function clearForm(){
|
|
$('#ff').form('clear');
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |