打开XDOC编辑器
在web开发中使用XDOC
1. 准备
1.1打开XDOC编辑器新建模板,并取名helloxdocMode 另存为fpd格式
1.2下载web要用到的文件:xdoc.js和fpd.swf。将helloxdocMode.fpd,xdoc.js,fpd.swf放入到web项目中。(我是都放在了WebRoot下了)
1.3新建helloxdoc.html并引入xdoc.js
2. 开发
<!--不能带DOCTYPE,否则会有xodc不能全屏显示的问题-->
<!--
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
-->
<html>
<head>
<title>'helloword.jsp'</title>
<script src="jquery-1.7.2.min.js"></script>
<script src="xdoc.js"></script>
</head>
<!--body样式,防止xdoc,html双滚动条-->
<body style="margin:0;overflow:hidden;">
<div id="formDiv"></div>
</body>
</html>
<script>
//XDoc.server是用来找fpd.swf的,即http://host:port/jweb/flash/fpd.swf
XDoc.server = "/jweb/flash";
XDoc.form("formDiv","helloxdocMode.fpd", {
onInit:function(form) {
},
onLoad:function(form) {
},
onSave:function(form) {
},
onChange:function(form,item) {
}
});
</script>
几个阁僚的地方
编写模板的时候要注意:xdoc有设计和运行两种模式。设计好后要点运行看一下实际效果。
- 实际显示与模板不符,web中会有偏移等显示乱象
在设计模式下会有这种问题,改为在运行模式下另存为即可。 - 编辑模板合并单元格时,显示时会挤到一起
在设计模式下选择好要调整的控件后,选择编辑表格属性找到位置->尺寸类型属性,更改为固定大小即可解决这个问题 - xdoc不能全屏显示
去掉html、jsp等头部的<!DOCTYPE HTML >
标签 - xdoc,html双滚动条
body添加样式:style=”margin:0;overflow:hidden;”