jsp:
<%@ page language="java" contentType="text/html; charset=utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ taglib uri="/WEB-INF/tagtld/htmlTagComponet.tld" prefix="JB"%>
<html>
<head>
<JB:ComponentBase id="bomponentBase" isJudgeSession="true"></JB:ComponentBase>
<style>
html,body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
overflow: hidden;
}
.bltable {
width: 100%;
}
.bltable td.bg {
color: #000000;
border-right: 0px solid #C1DAD7;
border-bottom: 0px dashed #8BB4D7;
border-top: 0px solid #C1DAD7;
border-left: 0px solid #C1DAD7;
text-align: right;
height:22px;
font: normal 9pt 宋体;
background-color: #D8E6F6;
background-repeat: repeat;
background-position: top;
vertical-align:middle ;
}
/**无背景*/
.bltable th.nobg {
border-right: 0px solid #C1DAD7;
border-bottom: 0px dashed #8BB4D7;
border-top: 0px solid #C1DAD7;
border-left: 0px solid #C1DAD7;
background: none;
vertical-align:middle;
font: normal 9pt 宋体;
}
.bltable td {
border-right: 0px solid #C1DAD7;
border-bottom: 0px dashed #8BB4D7;
border-top: 0px solid #C1DAD7;
border-left: 0px solid #C1DAD7;
background: #fff;
font: normal 9pt 宋体;
padding:1px;
vertical-align:middle;
color: #000000;
}
/**
td向右对齐
*/
.bltable td.td_align_right {
text-align:right;
vertical-align:middle;
}
/**
td向中对齐
*/
.bltable td.td_align_center {
vertical-align:middle;
}
/**
td向左对齐
*/
.bltable td.td_align_left {
text-align:left;
vertical-align:middle;
}
/**表格结束*/
fieldset {
padding:2px;
width:99%;
margin-top:1px;
border:0px solid navy;
background:#f4f9ff;
}
fieldset legend {
cursor:default;
color:#000;
font-weight:bold;
padding-left:10px;
padding-top:6px;
padding-bottom:6px;
border:0px solid #navy;
background:#f4f9ff;
font-size:14px;
}
fieldset label {
float:left;
width:100%;
text-align:center;
padding:15px;
margin:1px;
}
fieldset div {
clear:left;
margin-bottom:2px;
}
</style>
</head>
<script type="text/javascript">
function okOperate(){//确定
//刷新列表
closeBlDialog();
}
function noOperate(){//取消
closeBlDialog();
}
//异步请求回调函数
function ajaxbtnOkCallBack(data){
var dataObj = eval("(" + data + ")");
if(dataObj.result=='true'){
OpenBlDialog('创建日程明细','创建日程明细成功!','OK','','','okOperate()','noOperate()','','');
} else{
OpenBlDialog('创建日程明细','创建日程明细异常!','ERROR','','','okOperate()','noOperate()','','');
}
}
var formOperate = new FormOperateObject();
function btnOk(){//确定
var isValid = formOperate.formValidate('scheduleEditForm');//验证表单
var formDataStr = formOperate.getFormById('scheduleEditForm');//获取表单数据
formDataStr = formOperate.changeURLParamValue(formDataStr,'stpartdate',$('#stpartdate').datebox('getValue'));
formDataStr = formOperate.changeURLParamValue(formDataStr,'etpartdate',$('#etpartdate').datebox('getValue'));
if (isValid){
//提交数据
var url = "${pageContext.request.contextPath}/BPHandler?_bpForm=org.jplogic.system.web.view.webform.ScheduleMngForm&_operate=adddetails&operateType=add&"+formDataStr;
var data = formOperate.AjaxCall(url,false,'ajaxbtnOkCallBack');//同以下注释代码功能 ,返回的值可作为其他业务判断使用
}
}
function btnCannel(){//取消
//关闭当前form窗口
closeBlDialog();
//获取父窗口对象
closeBlWindowsByObject('ScheduleAddPageForm',parent.ScheduleAddPageForm);
parent.$("#gridcontainer").reload();
}
function okOperate(){//确定
//刷新列表
closeBlDialog();
closeBlWindowsByObject('ScheduleAddPageForm',parent.ScheduleAddPageForm);
parent.$("#gridcontainer").reload();
}
function noOperate(){//取消
closeBlDialog();
}
</script>
<body>
<form method="post" id="scheduleEditForm">
<table class="bltable" id="scheduleEdittable" border="0" cellspacing="0" style="width:100%;" >
<caption></caption>
<tbody>
<tr>
<td class="bg" width="15%" scope="col">*主题:</td>
<td class="td_align_left" colspan="3">
<JB:InputText id="Subject" name="Subject" classname="validatebox" style="width:550px;height:22px;border:1px solid #ccc;" data_Options="required:true" required="true" ></JB:InputText>
<!-- 隐藏域 -->
<JB:InputText id="colorvalue" name="colorvalue" type="hidden" style="width:125px;height:22px;border:1px solid #ccc;"></JB:InputText>
</td>
</tr>
<tr>
<td class="bg" width="15%" scope="col">*时间:</td>
<td class="td_align_left" colspan="3">
<JB:InputText id="stpartdate" name="stpartdate" classname="datebox" style="width:125px;height:22px;border:1px solid #ccc;" data_Options="required:true" required="true"></JB:InputText>
<JB:InputText id="etpartdate" name="etpartdate" classname="datebox" style="width:125px;height:22px;border:1px solid #ccc;" data_Options="required:true" required="true"></JB:InputText>
<input id="IsAllDayEvent" name="IsAllDayEvent" type="checkbox" value="1" "checked" />All Day Event
</td>
</tr>
<tr>
<td class="bg" width="15%" scope="col">位置信息:</td>
<td class="td_align_left" colspan="3">
<JB:InputText id="Location" name="Location" classname="validatebox" style="width:550px;height:22px;border:1px solid #ccc;" data_Options="required:true" required="true"></JB:InputText>
</td>
</tr>
<tr>
<td class="bg" width="15%" scope="col">备注:</td>
<td class="td_align_left" colspan="3">
<JB:TextArea id="description" componentName="description" style="width:550px;height:140px;border:1px solid #ccc;" rows="8" data_Options="required:true" required="true"></JB:TextArea>
</td>
</tr>
<tr align="center">
<td class="td_align_center" colspan="4" align="center">
<!-- 隐藏域 -->
<JB:InputText id="timezone" name="timezone" type="hidden" style="width:520px;height:22px;border:1px solid #ccc;"></JB:InputText>
<JB:InputText id="id" name="id" type="hidden" style="width:520px;height:22px;border:1px solid #ccc;"></JB:InputText>
<JB:Buttun id="ok" btnText="确定" onclick="btnOk()" style="width:90px;height:35px;"></JB:Buttun>
<JB:Buttun id="cannel" btnText="取消" onclick="btnCannel()" style="width:90px;height:35px;"></JB:Buttun>
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
截图:
<%@ page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib uri="/WEB-INF/tagtld/htmlTagComponet.tld" prefix="JB"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
<title> 日程管理</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/JBPlatformBase/EasyUI/themes/default/easyui.css"></link>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/JBPlatformBase/EasyUI/themes/icon.css"></link>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/JBPlatformBase/EasyUI/demo.css"></link>
<script type="text/javascript" src="${pageContext.request.contextPath}/JBPlatformBase/EasyUI/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/JBPlatformBase/EasyUI/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/JBPlatformBase/EasyUI/locale/easyui-lang-zh_CN.js"></script>
<link href="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/css/dailog.css" rel="stylesheet" type="text/css" />
<link href="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/css/calendar.css" rel="stylesheet" type="text/css" />
<link href="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/css/dp.css" rel="stylesheet" type="text/css" />
<link href="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/css/alert.css" rel="stylesheet" type="text/css" />
<link href="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/css/main.css" rel="stylesheet" type="text/css" />
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/jquery.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/Plugins/Common.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/Plugins/datepicker_lang_US.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/Plugins/jquery.datepicker.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/Plugins/jquery.alert.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/Plugins/jquery.ifrmdailog.js" defer="defer" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/Plugins/wdCalendar_lang_US.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/JBPlatformBase/xgCalendar/js/Plugins/jquery.calendar.js" type="text/javascript"></script>
<!-- 窗口支持 -->
<script src='${pageContext.request.contextPath}/JBPlatformBase/commonJs/extForm.js'></script>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<script type="text/javascript">
var ScheduleEditPageForm=null;//自定义编辑窗口
var ScheduleAddPageForm=null;
var basepath = '<%=basePath%>';
$(document).ready(function () {
var view = "week";
var DATA_FEED_URL = "${pageContext.request.contextPath}/BPHandler?_bpForm=org.jplogic.system.web.view.webform.ScheduleMngForm";
var op = {
view: view,
theme: 3,
showday: new Date(),//当前日期
EditCmdhandler: Edit,
DeleteCmdhandler: Delete,
ViewCmdhandler: View,
onWeekOrMonthToDay: wtd,
onBeforeRequestData: cal_beforerequest,//在请求之前
onAfterRequestData: cal_afterrequest,
onRequestDataError: cal_onerror,
autoload: true,
url: DATA_FEED_URL + "&_operate=list",
//快速添加日程响应的 Url 地址
quickAddUrl: DATA_FEED_URL + "&_operate=add",
////拖拽更新时响应的 Url 地址
quickUpdateUrl: DATA_FEED_URL + "&_operate=update",
//快速删除日程时响应的Urk 地址
quickDeleteUrl: DATA_FEED_URL + "&_operate=remove"
};
var $dv = $("#calhead");
var _MH = document.documentElement.clientHeight;
var dvH = $dv.height() + 2;
op.height = _MH - dvH;//视图的高度,如果不设置则默认获取所在页面的高度
op.eventItems = [];//日程数据,可通过此参数设置初始化数据
var p = $("#gridcontainer").bcalendar(op).BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
$("#caltoolbar").noSelect();
$("#hdtxtshow").datepicker({ picker: "#txtdatetimeshow", showtarget: $("#txtdatetimeshow"),
onReturn: function (r) {
var p = $("#gridcontainer").gotoDate(r).BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
}
});
function cal_beforerequest(type) {//在请求之前,type为数字,表示事件的类型(1:加载,2:新增,3:删除,4:更新)
var t = "数据加载中...";
switch (type) {
case 1:
t = "数据加载中...";
break;
case 2:
case 3:
case 4:
t = "该请求处理...";
break;
}
$("#errorpannel").hide();
$("#loadingpannel").html(t).show();
}
function cal_afterrequest(type) {//请求之后执行,type为数字,表示事件的类型(1:加载,2:新增,3:删除,4:更新)
switch (type) {
case 1:
$("#loadingpannel").hide();
break;
case 2:
case 3:
case 4:
$("#loadingpannel").html("Success!");
window.setTimeout(function () { $("#loadingpannel").hide(); }, 2000);
break;
}
}
function cal_onerror(type, data) {
$("#errorpannel").show();
}
function Edit(data) {//编辑
/*
var eurl = "${pageContext.request.contextPath}/jsp/JpSystem/ScheduleEditForm.jsp?id={0}&start={2}&end={3}&isallday={4}&title={1}";
if (data) {
var url = StrFormat(eurl, data);
alert(url);
OpenModelWindow(url, { width: 600, height: 400, caption: "修改日程明细", onclose: function () {
$("#gridcontainer").reload();
}
});
}
*/
if(data){
var formOperate = new FormOperateObject();
//提交数据
var url = "${pageContext.request.contextPath}/BPHandler?_bpForm=org.jplogic.system.web.view.webform.ScheduleMngForm&_operate=editSchedule&id={0}&start={2}&end={3}&isallday={4}&title={1}";
url = StrFormat(url, data);
$.ajax({
type: "post",
url: url,
datatype: "json",
contentType: "application/json;charset=utf-8",
success: function(data) {
var dataObj= eval("(" + data + ")");
if(dataObj.result=='true'){
//打开窗体
ScheduleEditPageForm = OpenBlWindows('修改日程明细','','${pageContext.request.contextPath}/images/blImgs/windows.png','ScheduleEditPageForm',850,350,'${pageContext.request.contextPath}/jsp/JpSystem/ScheduleEditPageForm.jsp',false,'',true,true,true,true);
}else if(dataObj.result=='false'){
OpenBlDialog('修改日程明细','修改日程明细异常!','ERROR','','','okOperate()','noOperate()','','',basepath);
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
}
function okOperate(){//确定
//刷新列表
closeBlDialog();
}
function noOperate(){//取消
closeBlDialog();
}
function View(data) {
var str = "";
$.each(data, function (i, item) {
str += "[" + i + "]: " + item + "\n";
});
document.write(str); debugger;
}
function Delete(data, callback) {
$.alerts.okButton = "确定";
$.alerts.cancelButton = "取消";
hiConfirm("是否删除该日程安排记录?", '确认', function (r) {
r && callback(0);
});
}
function wtd(p) {
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
$("#caltoolbar div.fcurrent").each(function () {
$(this).removeClass("fcurrent");
})
$("#showdaybtn").addClass("fcurrent");
}
//to show day view
$("#showdaybtn").click(function (e) {
//document.location.href="#day";
$("#caltoolbar div.fcurrent").each(function () {
$(this).removeClass("fcurrent");
})
$(this).addClass("fcurrent");
var p = $("#gridcontainer").swtichView("day").BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
});
//to show week view
$("#showweekbtn").click(function (e) {
//document.location.href="#week";
$("#caltoolbar div.fcurrent").each(function () {
$(this).removeClass("fcurrent");
})
$(this).addClass("fcurrent");
var p = $("#gridcontainer").swtichView("week").BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
});
//to show month view
$("#showmonthbtn").click(function (e) {
//document.location.href="#month";
$("#caltoolbar div.fcurrent").each(function () {
$(this).removeClass("fcurrent");
})
$(this).addClass("fcurrent");
var p = $("#gridcontainer").swtichView("month").BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
});
$("#showreflashbtn").click(function (e) {///刷新事件
$("#gridcontainer").reload();
});
//新增日程安排事件
$("#faddbtn").click(function (e) {
/*
var eurl = "${pageContext.request.contextPath}/jsp/JpSystem/ScheduleEditForm.jsp?id={0}&start={2}&end={3}&isallday={4}&title={1}";
var url = eurl;
OpenModelWindow(url, { width: 500, height: 400, caption: "创建日程安排" });//打开窗口
*/
//打开窗体
ScheduleAddPageForm = OpenBlWindows('创建日程安排','','${pageContext.request.contextPath}/images/blImgs/windows.png','ScheduleAddPageForm',850,350,'${pageContext.request.contextPath}/jsp/JpSystem/ScheduleAddPageForm.jsp',false,'',true,true,true,true);
});
//go to today
$("#showtodaybtn").click(function (e) {
var p = $("#gridcontainer").gotoDate().BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
});
//previous date range
$("#sfprevbtn").click(function (e) {
var p = $("#gridcontainer").previousRange().BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
});
//next date range
$("#sfnextbtn").click(function (e) {
var p = $("#gridcontainer").nextRange().BcalGetOp();
if (p && p.datestrshow) {
$("#txtdatetimeshow").text(p.datestrshow);
}
});
});
</script>
</head>
<body>
<div>
<div></div>
<div id="calhead" style="padding-left:1px;padding-right:1px;">
<div class="cHead"><div class="ftitle">日程安排管理</div>
<div id="loadingpannel" class="ptogtitle loadicon" style="display: none;">加载数据中...</div>
<div id="errorpannel" class="ptogtitle loaderror" style="display: none;">很抱歉,无法加载数据,请稍后再试</div>
</div>
<div id="caltoolbar" class="ctoolbar">
<div id="faddbtn" class="fbutton">
<div>
<span title='创建新事件' class="addcal">
新增
</span>
</div>
</div>
<div class="btnseparator"></div>
<div id="showtodaybtn" class="fbutton">
<div>
<span title='返回今天日程记录' class="showtoday">
今天
</span>
</div>
</div>
<div class="btnseparator"></div>
<div id="showdaybtn" class="fbutton">
<div><span title='天' class="showdayview">天</span></div>
</div>
<div id="showweekbtn" class="fbutton fcurrent">
<div><span title='周' class="showweekview">周</span></div>
</div>
<div id="showmonthbtn" class="fbutton">
<div><span title='月' class="showmonthview">月</span></div>
</div>
<div class="btnseparator"></div>
<div id="showreflashbtn" class="fbutton">
<div><span title='刷新视图' class="showdayflash">刷新</span></div>
</div>
<div class="btnseparator"></div>
<div id="sfprevbtn" title="向前" class="fbutton">
<span class="fprev"></span>
</div>
<div id="sfnextbtn" title="下一个" class="fbutton">
<span class="fnext"></span>
</div>
<div class="fshowdatep fbutton">
<div>
<input type="hidden" name="txtshow" id="hdtxtshow" />
<span id="txtdatetimeshow">正加载...</span>
</div>
</div>
<div class="clear"></div>
</div>
</div>
<div style="padding:1px;">
<div class="t1 chromeColor">
</div>
<div class="t2 chromeColor">
</div>
<div id="dvCalMain" class="calmain printborder">
<div id="gridcontainer" style="overflow-y: visible;">
</div>
</div>
<div class="t2 chromeColor">
</div>
<div class="t1 chromeColor">
</div>
</div>
</div>
</body>
</html>
截图:
代码:
/**
* 编辑日程安排信息记录