配合拖动页面中控件达到页面动态生成后页面的排版效果。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>窗体设计</title>
<SCRIPT language="JavaScript" src="/cmsweb/script/jscommon.js"></SCRIPT>
<script language="JavaScript">
<!--
/*
代码说明:
-、下面代码中的"xx"、"yy"是为移动元素所需的2个动态属性,分别记录移动前的X和Y坐标。
-、主元素(主选择元素):第一个选中的元素;次元素(次选择元素):第二个开始选中的所有元素
*/
var IsDesignChanged=false
var IsDraging=false //判断是否处于拖动状态中
var xMouseBefMove, yMouseBefMove //移动元素前的鼠标X、Y坐标
var currentSelMainElement //当前选中的主元素(第一个选中的元素)
var currentDot //当前正移动(正改变主选择元素宽度高度)的定位点
var saveSign //保存类型:save, saveas
var arrElments = new Array() //保存所有次选择元素(第二个开始选中的元素)
var arrDots = new Array() //保存所有次选择元素的定位点
var g_pointSelTimes = 0; //多选控件时判断第几次点击
var g_pointStartX = 0; //多选控件的起点
var g_pointStartY = 0; //多选控件的起点
var g_pointEndX = 0; //多选控件的终点
var g_pointEndY = 0; //多选控件的终点
document.onmousedown=EvtMouseDown //定义鼠标点击的事件入口
document.onmouseup=EvtMouseUp //定义鼠标放开的事件入口
document.onkeydown=EvtKeyDown //定义键盘点击的事件入口
document.onmouseover=EvtMouseOver //定义鼠标移至的事件入口
//添加元素
function AddElement(){
try{
IsDesignChanged=true
//获取选择的字段
var selIndex = document.all.item("ListBox1").selectedIndex;
if (selIndex == -1){
alert("请选择合适的字段!");
return;
}
var ctlDispName = document.all.item("ListBox1").options(selIndex).text;
var valType = GetCtrlValType(document.all.item("ListBox1").options(selIndex).value)
var ctlName = GetCtrlName(document.all.item("ListBox1").options(selIndex).value)
//创建Text元素
var blnCreateLabel = 1;
if (valType == "1"){ //选择项
var ctlText1 = document.createElement("<SELECT ctrltype='ddlist' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' style='Z-INDEX: 125; POSITION: absolute; HEIGHT: 20px; WIDTH: 90px;TOP:5px;LEFT:97px'> <OPTION selected></OPTION></SELECT>");
panelForm.appendChild(ctlText1);
}else if (valType == "101"){ //是输入窗体设计中的多媒体型
//创建文件上传控件元素
var ctlFile1 = document.createElement("<INPUT ctrltype='image' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' type='file' id='" + ctlName + "' name='" + ctlName + "' dragSign='fileElement' disabled style='Z-INDEX: 103; POSITION: absolute; LEFT: 97px; TOP: 5px; WIDTH: 222px'>");
panelForm.appendChild(ctlFile1);
}else if (valType == "102"){ //是打印窗体设计中的多媒体型
var ctlImg1 = document.createElement("<IMG border=0 ctrltype='image' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' style='Z-INDEX: 125; LEFT: 97px; POSITION: absolute; TOP: 5px; HEIGHT:80px; WIDTH:80px' alt='图片'>");
panelForm.appendChild(ctlImg1);
}else if (valType == "100"){ //是打印窗体设计中的所有元素显示为Label
var ctlLabel1 = document.createElement("<label ctrltype='TextboxInPrint' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' align='left' id='" + ctlName + "' name='" + ctlName + "' value='[" + ctlDispName + "]' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 90px;top:9px;left:97px '></label>");
ctlLabel1.innerText = "[" + ctlDispName + "]";
panelForm.appendChild(ctlLabel1);
}else if (valType == "11"){ //多选一选择项
var ctlText1 = document.createElement("<input ctrltype='radio' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' value='[" + ctlDispName + "]' readonly style='POSITION: absolute; HEIGHT: 45px; WIDTH: 400px;top:5px;left:97px'>");
panelForm.appendChild(ctlText1);
blnCreateLabel = 0; //不显示Label
}else if (valType == "13"){ //目录文件
var ctlFile1 = document.createElement("<INPUT ctrltype='fileForDirFile' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' type='file' id='" + ctlName + "' name='" + ctlName + "' dragSign='fileElement' disabled style='Z-INDEX: 103; POSITION: absolute; LEFT: 97px; TOP: 5px; WIDTH: 222px'>");
panelForm.appendChild(ctlFile1);
}else if (valType == "12"){ //是否选择项
var ctlText1 = document.createElement("<input ctrltype='checkgrp' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' type='checkbox' disabled value='[" + ctlDispName + "]' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 200px;top:5px;left:97px'>");
panelForm.appendChild(ctlText1);
blnCreateLabel = 0; //不显示Label
}else{ //if (valType == "0"){ //是输入型
var ctlText1 = document.createElement("<input ctrltype='text' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' value='[" + ctlDispName + "]' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 90px;top:5px;left:97px'>");
panelForm.appendChild(ctlText1);
}
//创建Label元素
if (blnCreateLabel==1){
//var lblName = "lbl" + ctlName;
var lblName = "lbl_" + Math.round(Math.random() * 10000000000); // + "_" + ctlName;
var strAlign = "right";
if (self.document.forms(0).formtype.value == 1){
strAlign = "left";
}
var ctlLabel1 = document.createElement("<label ctrltype='label' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' align='right' id='" + lblName + "' name='" + lblName + "' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:9px;left:32px;TEXT-ALIGN: " + strAlign + "'></label>");
ctlLabel1.innerText = ctlDispName;
panelForm.appendChild(ctlLabel1);
}
}catch(ex){
}
}
//获取窗体内所有元素的布局信息
function GetDFormLayout(){
//获取窗体本身布局信息
var ctlInfo = ";;" + "1||" + "FORM_CONTAINER" + "||0||||" + panelForm.style.left + "||" + panelForm.style.top + "||" + panelForm.style.pixelWidth + "||" + panelForm.style.pixelHeight + "||||;;";
//获取窗体内所有元素的布局信息
for (var i = 0; i < panelForm.all.length; i++){
var ctlItem = panelForm.all.item(i);
var intHeight = ctlItem.style.pixelHeight;
if (ctlItem.style.display != "none" && ctlItem.name != null){ //不保存隐藏的元素
if (ctlItem.ctrltype == "label"){
//2: 表示是标签Label
ctlInfo = ctlInfo + "2||" + ctlItem.name + "||0||" + ctlItem.innerText + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||;;";
}
else if (ctlItem.ctrltype == "TextboxInPrint"){
//14: 所有元素在打印窗体中都显示为Label
ctlInfo = ctlInfo + "14||" + ctlItem.name + "||0||" + ctlItem.innerText + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||;;";
}
else if (ctlItem.ctrltype == "text"){
//3: 表示是输入型元素(如Text)
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "3||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else if (ctlItem.ctrltype == "image"){
//4: 表示是Image图形控件
ctlInfo = ctlInfo + "4||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "pageimg"){
//13: 表示是页面上的图形文件
ctlInfo = ctlInfo + "13||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
//}else if (ctlItem.ctrltype == "imagefile"){
// //4: 表示是Image图形控件
// ctlInfo = ctlInfo + "4||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "imageForBinCol"){
//15: 二进制字段以图片方式显示
ctlInfo = ctlInfo + "15||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "fileForDirFile"){
//18: 目录文件的文件控件
ctlInfo = ctlInfo + "18||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "imageForDirFile"){
//17: 目录文件的图片显示
ctlInfo = ctlInfo + "17||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "imageForUrlCol"){
//16: 二进制字段以图片方式显示
ctlInfo = ctlInfo + "16||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "file"){
//5: 表示是File控件,文件上传控件
ctlInfo = ctlInfo + "5||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlItem.value + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||||" + "||||;;";
}else if (ctlItem.ctrltype == "ddlist"){
//6: 表示是DropDownList
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "6||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else if (ctlItem.ctrltype == "line"){
//7: 表示是Line控件
ctlInfo = ctlInfo + "7||" + ctlItem.name + "||0||" + "线条" + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "ResTable"){
//8: 表示是资源表单控件
ctlInfo = ctlInfo + "8||" + ctlItem.name + "||0||" + ctlItem.tabresid + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "cmsbtn"){
//9: 表示是普通按钮
ctlInfo = ctlInfo + "9||" + ctlItem.name + "||0||" + ctlItem.value + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||" + ctlItem.ctrlscript + "||;;";
}else if (ctlItem.ctrltype == "linkbtn"){
//10: 表示是普通链接
if (ctlItem.innerText != ""){
ctlInfo = ctlInfo + "10||" + ctlItem.name + "||0||" + ctlItem.innerText + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||" + ctlItem.ctrlscript + "||;;";
}else{
ctlInfo = ctlInfo + "10||" + ctlItem.name + "||0||" + ctlItem.value + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||" + ctlItem.ctrlscript + "||;;";
}
}else if (ctlItem.ctrltype == "radio"){
//11: 表示是多选一选择项
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "11||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else if (ctlItem.ctrltype == "checkgrp"){
//12: 表示是是否选择项
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "12||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else{
//未知元素
}
}
}
return ctlInfo;
}
//解析字段值类型
function GetCtrlValType(optValue){
var strTemp = new String(optValue);
var pos = strTemp.indexOf ("]", 0)
return strTemp.substring(1, pos)
}
//解析字段名称
function GetCtrlName(optValue){
var strTemp = new String(optValue);
var pos = strTemp.indexOf ("]", 0);
var curResID;
var relRes = document.all.item("ddlHostTables")
if (relRes == null){
curResID = getUrlParam("mnuresid");
}else{
curResID = relRes.options(relRes.selectedIndex).value;
if(curResID == ""){
relRes = document.all.item("ddlSubTables")
curResID = relRes.options(relRes.selectedIndex).value;
}else{
}
}
return "TAB" + curResID + "___" + strTemp.substring(pos+1);
}
function DoNothing(){
return false;
}
//元素水平对齐
function AlignHorizontal(){
IsDesignChanged=true
try{
//先计算需要对齐的高度位置,如果第一个选择的控件是Label,则高度-4,因为Label比Textbox低4个像素
var posTop;
if (currentSelMainElement.ctrltype == "label"){
posTop = parseInt(currentSelMainElement.style.pixelTop) - 4;
}else if (currentSelMainElement.ctrltype == "text"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "image"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "pageimg"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "imageForBinCol"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "imageForDirFile"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "imageForUrlCol"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "fileForDirFile"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
//}else if (currentSelMainElement.ctrltype == "imagefile"){
// posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "file"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "ddlist"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "TextboxInPrint"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "radio"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "checkgrp"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "ResTable"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "line"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "cmsbtn"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "linkbtn"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}
//对齐指定类型的控件
for (var i=0; i<arrElments.length; i++){
if (arrElments[i].ctrltype == "label"){
arrElments[i].style.pixelTop=posTop + 4;
}else if (arrElments[i].ctrltype == "text"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "image"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "pageimg"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "imageForBinCol"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "imageForDirFile"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "imageForUrlCol"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "fileForDirFile"){
arrElments[i].style.pixelTop=posTop;
//}else if (arrElments[i].ctrltype == "imagefile"){
// arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "file"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "ddlist"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "TextboxInPrint"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "radio"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "checkgrp"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "ResTable"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "line"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "cmsbtn"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "linkbtn"){
arrElments[i].style.pixelTop=posTop;
}
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//元素左对齐
function AlignLeft(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelLeft);
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelLeft=pos;
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//元素右对齐
function AlignRight(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelLeft) + parseInt(currentSelMainElement.style.pixelWidth);
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelLeft=pos - parseInt(arrElments[i].style.pixelWidth)
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//宽度对齐
function AlignWidth(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelWidth);
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelWidth=pos;
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//高度对齐
function AlignHeight(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelHeight);
if (pos<=0){
pos = 20; //有些元素无法获取高度,默认为20pixel
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelHeight=pos;
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//元素内部文字左对齐
function TextAlignLeft(){
IsDesignChanged=true
try{
if (currentSelMainElement != null){
currentSelMainElement.style.textAlign = "left"
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.textAlign = "left"
}
}catch(ex){
}
}
//元素内部文字右对齐
function TextAlignRight(){
IsDesignChanged=true
try{
if (currentSelMainElement != null){
currentSelMainElement.style.textAlign = "right"
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.textAlign = "right"
}
}catch(ex){
}
}
//元素内部文字居中对齐
function TextAlignCenter(){
IsDesignChanged=true
try{
if (currentSelMainElement != null){
currentSelMainElement.style.textAlign = "center"
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.textAlign = "center"
}
}catch(ex){
}
}
//鼠标Over事件入口
function EvtMouseOver(){
try{
if (event.srcElement.dragSign=="frmElement"){
event.srcElement.style.cursor = "move"; //鼠标移至元素上时显示“鼠标移动”标志
}
}catch(ex){
}
}
//键盘击键的事件响应入口
function EvtKeyDown(){
try{
if (event.keyCode == 46){ //键盘Del键
IsDesignChanged=true
DeleteElement();
}
}catch(ex){
}
}
//放开鼠标的事件入口
function EvtMouseUp(){
try{
if (IsDraging == false){
return;
}
IsDraging=false
//定位主选择元素
currentSelMainElement.xx = currentSelMainElement.style.pixelLeft
currentSelMainElement.yy = currentSelMainElement.style.pixelTop
//定位主选择元素的4个定位点
frmInputDesign.left_mid.xx = frmInputDesign.left_mid.style.pixelLeft
frmInputDesign.left_mid.yy = frmInputDesign.left_mid.style.pixelTop
frmInputDesign.middle_top.xx = frmInputDesign.middle_top.style.pixelLeft
frmInputDesign.middle_top.yy = frmInputDesign.middle_top.style.pixelTop
frmInputDesign.middle_bot.xx = frmInputDesign.middle_bot.style.pixelLeft
frmInputDesign.middle_bot.yy = frmInputDesign.middle_bot.style.pixelTop
frmInputDesign.right_mid.xx = frmInputDesign.right_mid.style.pixelLeft
frmInputDesign.right_mid.yy = frmInputDesign.right_mid.style.pixelTop
//定位所有次选择元素
for (var i=0; i < arrElments.length; i++){
arrElments[i].xx = arrElments[i].style.pixelLeft
arrElments[i].yy = arrElments[i].style.pixelTop
}
//定位所有次选择元素的定位点
for (var i=0; i < arrDots.length; i++){
arrDots[i].xx = arrDots[i].style.pixelLeft
arrDots[i].yy = arrDots[i].style.pixelTop
}
//显示当前选中的元素的位置
if (currentSelMainElement != null){
//document.all.item("lblStatus1").innerText = "元素宽:" + currentSelMainElement.style.pixelWidth + " 高:" + currentSelMainElement.style.pixelHeight + " x:" + currentSelMainElement.style.pixelLeft + " y:" + currentSelMainElement.style.pixelTop
}
}catch(ex){
}
}
//添加标签元素
function AddElementLabel(){
IsDesignChanged=true
var lblValue = window.prompt("请输入标签显示内容:", "");
if (lblValue == null){
return; //用户点击了“取消”
}
var ctlName = "lbl" + Math.round(Math.random() * 10000000000);
var ctlLabel1 = document.createElement("<label ctrltype='label' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px '></label>");
ctlLabel1.innerText = lblValue;
panelForm.appendChild(ctlLabel1);
return false;
}
//添加"文件上传控件"元素
function AddElementFile(){
IsDesignChanged=true;
var ctlName = "CmsFile" + Math.round(Math.random() * 10000000000);
var ctlFile1 = document.createElement("<INPUT ctrltype='file' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' type='file' id='" + ctlName + "' name='" + ctlName + "' dragSign='fileElement' disabled style='Z-INDEX: 103; POSITION: absolute; LEFT: 97px; TOP: 5px; WIDTH: 222px'>");
panelForm.appendChild(ctlFile1);
return true;
}
function AddElementButton(){
IsDesignChanged=true
var btnValue = window.prompt("请输入按钮名称:", "");
if (btnValue == null){
return; //用户点击了“取消”
}
var ctlName = "cmsbtn" + Math.round(Math.random() * 10000000000);
var ctlBtn = document.createElement("<INPUT type=button value=" + btnValue + " ctrltype='cmsbtn' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px'>");
panelForm.appendChild(ctlBtn);
return false;
}
function AddElementLinkbtn(){
IsDesignChanged=true
var btnValue = window.prompt("请输入链接名称:", "");
if (btnValue == null){
return; //用户点击了“取消”
}
var ctlName = "linkbtn" + Math.round(Math.random() * 10000000000);
var ctlBtn = document.createElement("<INPUT type=button value=" + btnValue + " ctrltype='linkbtn' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px'>");
//var ctlBtn = document.createElement("<a id='" + ctlName + "' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px'>" + btnValue + "</a>");
panelForm.appendChild(ctlBtn);
return false;
}
function AddElementScript(){
IsDesignChanged=true;
try{
if (currentSelMainElement == null){
return false;
}
var rtnVal = window.showModalDialog("/cmsweb/cmsform/FormSetElementScript.aspx?ctrlscript=" + currentSelMainElement.ctrlscript, "_blank", "dialogHeight:430px; dialogWidth:580px; center;yes");
var strRtn = new String(rtnVal);
currentSelMainElement.ctrlscript = strRtn;
//if (strRtn != ""){
// var pos1 = strRtn.indexOf("$PROPNAME", 0)
// var pos2 = strRtn.indexOf("$PROPVAL", 0)
// if (pos1 >= 0 && pos2 >= 0){
// var strPropName = strRtn.substring(pos1+10, pos2)
// var strPropValue = strRtn.substring(pos2+9)
// currentSelMainElement.ctrlscript = strPropValue;
// }
//}
}catch(ex){
alert("请选择有效的控件!");
}
}
function SetFormProperty(){
//IsDesignChanged=true;
try{
//获取当前资源ID
//window.showModalDialog("/cmsweb/cmsform/FormSetProperty.aspx?mnures>script>
<!--
/*
代码说明:
-、下面代码中的"xx"、"yy"是为移动元素所需的2个动态属性,分别记录移动前的X和Y坐标。
-、主元素(主选择元素):第一个选中的元素;次元素(次选择元素):第二个开始选中的所有元素
*/
var IsDesignChanged=false
var IsDraging=false //判断是否处于拖动状态中
var xMouseBefMove, yMouseBefMove //移动元素前的鼠标X、Y坐标
var currentSelMainElement //当前选中的主元素(第一个选中的元素)
var currentDot //当前正移动(正改变主选择元素宽度高度)的定位点
var saveSign //保存类型:save, saveas
var arrElments = new Array() //保存所有次选择元素(第二个开始选中的元素)
var arrDots = new Array() //保存所有次选择元素的定位点
var g_pointSelTimes = 0; //多选控件时判断第几次点击
var g_pointStartX = 0; //多选控件的起点
var g_pointStartY = 0; //多选控件的起点
var g_pointEndX = 0; //多选控件的终点
var g_pointEndY = 0; //多选控件的终点
document.onmousedown=EvtMouseDown //定义鼠标点击的事件入口
document.onmouseup=EvtMouseUp //定义鼠标放开的事件入口
document.onkeydown=EvtKeyDown //定义键盘点击的事件入口
document.onmouseover=EvtMouseOver //定义鼠标移至的事件入口
//添加元素
function AddElement(){
try{
IsDesignChanged=true
//获取选择的字段
var selIndex = document.all.item("ListBox1").selectedIndex;
if (selIndex == -1){
alert("请选择合适的字段!");
return;
}
var ctlDispName = document.all.item("ListBox1").options(selIndex).text;
var valType = GetCtrlValType(document.all.item("ListBox1").options(selIndex).value)
var ctlName = GetCtrlName(document.all.item("ListBox1").options(selIndex).value)
//创建Text元素
var blnCreateLabel = 1;
if (valType == "1"){ //选择项
var ctlText1 = document.createElement("<SELECT ctrltype='ddlist' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' style='Z-INDEX: 125; POSITION: absolute; HEIGHT: 20px; WIDTH: 90px;TOP:5px;LEFT:97px'> <OPTION selected></OPTION></SELECT>");
panelForm.appendChild(ctlText1);
}else if (valType == "101"){ //是输入窗体设计中的多媒体型
//创建文件上传控件元素
var ctlFile1 = document.createElement("<INPUT ctrltype='image' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' type='file' id='" + ctlName + "' name='" + ctlName + "' dragSign='fileElement' disabled style='Z-INDEX: 103; POSITION: absolute; LEFT: 97px; TOP: 5px; WIDTH: 222px'>");
panelForm.appendChild(ctlFile1);
}else if (valType == "102"){ //是打印窗体设计中的多媒体型
var ctlImg1 = document.createElement("<IMG border=0 ctrltype='image' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' style='Z-INDEX: 125; LEFT: 97px; POSITION: absolute; TOP: 5px; HEIGHT:80px; WIDTH:80px' alt='图片'>");
panelForm.appendChild(ctlImg1);
}else if (valType == "100"){ //是打印窗体设计中的所有元素显示为Label
var ctlLabel1 = document.createElement("<label ctrltype='TextboxInPrint' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' align='left' id='" + ctlName + "' name='" + ctlName + "' value='[" + ctlDispName + "]' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 90px;top:9px;left:97px '></label>");
ctlLabel1.innerText = "[" + ctlDispName + "]";
panelForm.appendChild(ctlLabel1);
}else if (valType == "11"){ //多选一选择项
var ctlText1 = document.createElement("<input ctrltype='radio' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' value='[" + ctlDispName + "]' readonly style='POSITION: absolute; HEIGHT: 45px; WIDTH: 400px;top:5px;left:97px'>");
panelForm.appendChild(ctlText1);
blnCreateLabel = 0; //不显示Label
}else if (valType == "13"){ //目录文件
var ctlFile1 = document.createElement("<INPUT ctrltype='fileForDirFile' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' type='file' id='" + ctlName + "' name='" + ctlName + "' dragSign='fileElement' disabled style='Z-INDEX: 103; POSITION: absolute; LEFT: 97px; TOP: 5px; WIDTH: 222px'>");
panelForm.appendChild(ctlFile1);
}else if (valType == "12"){ //是否选择项
var ctlText1 = document.createElement("<input ctrltype='checkgrp' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' type='checkbox' disabled value='[" + ctlDispName + "]' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 200px;top:5px;left:97px'>");
panelForm.appendChild(ctlText1);
blnCreateLabel = 0; //不显示Label
}else{ //if (valType == "0"){ //是输入型
var ctlText1 = document.createElement("<input ctrltype='text' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' id='" + ctlName + "' name='" + ctlName + "' value='[" + ctlDispName + "]' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 90px;top:5px;left:97px'>");
panelForm.appendChild(ctlText1);
}
//创建Label元素
if (blnCreateLabel==1){
//var lblName = "lbl" + ctlName;
var lblName = "lbl_" + Math.round(Math.random() * 10000000000); // + "_" + ctlName;
var strAlign = "right";
if (self.document.forms(0).formtype.value == 1){
strAlign = "left";
}
var ctlLabel1 = document.createElement("<label ctrltype='label' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' dragSign='frmElement' align='right' id='" + lblName + "' name='" + lblName + "' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:9px;left:32px;TEXT-ALIGN: " + strAlign + "'></label>");
ctlLabel1.innerText = ctlDispName;
panelForm.appendChild(ctlLabel1);
}
}catch(ex){
}
}
//获取窗体内所有元素的布局信息
function GetDFormLayout(){
//获取窗体本身布局信息
var ctlInfo = ";;" + "1||" + "FORM_CONTAINER" + "||0||||" + panelForm.style.left + "||" + panelForm.style.top + "||" + panelForm.style.pixelWidth + "||" + panelForm.style.pixelHeight + "||||;;";
//获取窗体内所有元素的布局信息
for (var i = 0; i < panelForm.all.length; i++){
var ctlItem = panelForm.all.item(i);
var intHeight = ctlItem.style.pixelHeight;
if (ctlItem.style.display != "none" && ctlItem.name != null){ //不保存隐藏的元素
if (ctlItem.ctrltype == "label"){
//2: 表示是标签Label
ctlInfo = ctlInfo + "2||" + ctlItem.name + "||0||" + ctlItem.innerText + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||;;";
}
else if (ctlItem.ctrltype == "TextboxInPrint"){
//14: 所有元素在打印窗体中都显示为Label
ctlInfo = ctlInfo + "14||" + ctlItem.name + "||0||" + ctlItem.innerText + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||;;";
}
else if (ctlItem.ctrltype == "text"){
//3: 表示是输入型元素(如Text)
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "3||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else if (ctlItem.ctrltype == "image"){
//4: 表示是Image图形控件
ctlInfo = ctlInfo + "4||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "pageimg"){
//13: 表示是页面上的图形文件
ctlInfo = ctlInfo + "13||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
//}else if (ctlItem.ctrltype == "imagefile"){
// //4: 表示是Image图形控件
// ctlInfo = ctlInfo + "4||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "imageForBinCol"){
//15: 二进制字段以图片方式显示
ctlInfo = ctlInfo + "15||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "fileForDirFile"){
//18: 目录文件的文件控件
ctlInfo = ctlInfo + "18||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "imageForDirFile"){
//17: 目录文件的图片显示
ctlInfo = ctlInfo + "17||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "imageForUrlCol"){
//16: 二进制字段以图片方式显示
ctlInfo = ctlInfo + "16||" + ctlItem.name + "||0||" + ctlItem.src + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "file"){
//5: 表示是File控件,文件上传控件
ctlInfo = ctlInfo + "5||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlItem.value + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||||" + "||||;;";
}else if (ctlItem.ctrltype == "ddlist"){
//6: 表示是DropDownList
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "6||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else if (ctlItem.ctrltype == "line"){
//7: 表示是Line控件
ctlInfo = ctlInfo + "7||" + ctlItem.name + "||0||" + "线条" + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "ResTable"){
//8: 表示是资源表单控件
ctlInfo = ctlInfo + "8||" + ctlItem.name + "||0||" + ctlItem.tabresid + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||||;;";
}else if (ctlItem.ctrltype == "cmsbtn"){
//9: 表示是普通按钮
ctlInfo = ctlInfo + "9||" + ctlItem.name + "||0||" + ctlItem.value + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||" + ctlItem.ctrlscript + "||;;";
}else if (ctlItem.ctrltype == "linkbtn"){
//10: 表示是普通链接
if (ctlItem.innerText != ""){
ctlInfo = ctlInfo + "10||" + ctlItem.name + "||0||" + ctlItem.innerText + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||" + ctlItem.ctrlscript + "||;;";
}else{
ctlInfo = ctlInfo + "10||" + ctlItem.name + "||0||" + ctlItem.value + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + "||" + ctlItem.ctrlscript + "||;;";
}
}else if (ctlItem.ctrltype == "radio"){
//11: 表示是多选一选择项
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "11||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else if (ctlItem.ctrltype == "checkgrp"){
//12: 表示是是否选择项
var ctlName = ctlItem.value
ctlInfo = ctlInfo + "12||" + ctlItem.name + "||" + ctlItem.ctrlreadonly + "||" + ctlName + "||" + ctlItem.style.left + "||" + ctlItem.style.top + "||" + ctlItem.style.pixelWidth + "||" + intHeight + "||" + ctlItem.style.textAlign + "||||";
ctlInfo = ctlInfo + ctlItem.style.fontFamily + "||" + ctlItem.style.fontSize + "||" + ctlItem.style.color + "||" + ctlItem.style.fontWeight + "||" + ctlItem.style.fontStyle + "||" + ctlItem.style.textDecoration + "||" + ctlItem.ctrlbitian + "||;;";
}else{
//未知元素
}
}
}
return ctlInfo;
}
//解析字段值类型
function GetCtrlValType(optValue){
var strTemp = new String(optValue);
var pos = strTemp.indexOf ("]", 0)
return strTemp.substring(1, pos)
}
//解析字段名称
function GetCtrlName(optValue){
var strTemp = new String(optValue);
var pos = strTemp.indexOf ("]", 0);
var curResID;
var relRes = document.all.item("ddlHostTables")
if (relRes == null){
curResID = getUrlParam("mnuresid");
}else{
curResID = relRes.options(relRes.selectedIndex).value;
if(curResID == ""){
relRes = document.all.item("ddlSubTables")
curResID = relRes.options(relRes.selectedIndex).value;
}else{
}
}
return "TAB" + curResID + "___" + strTemp.substring(pos+1);
}
function DoNothing(){
return false;
}
//元素水平对齐
function AlignHorizontal(){
IsDesignChanged=true
try{
//先计算需要对齐的高度位置,如果第一个选择的控件是Label,则高度-4,因为Label比Textbox低4个像素
var posTop;
if (currentSelMainElement.ctrltype == "label"){
posTop = parseInt(currentSelMainElement.style.pixelTop) - 4;
}else if (currentSelMainElement.ctrltype == "text"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "image"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "pageimg"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "imageForBinCol"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "imageForDirFile"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "imageForUrlCol"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "fileForDirFile"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
//}else if (currentSelMainElement.ctrltype == "imagefile"){
// posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "file"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "ddlist"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "TextboxInPrint"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "radio"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "checkgrp"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "ResTable"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "line"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "cmsbtn"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}else if (currentSelMainElement.ctrltype == "linkbtn"){
posTop = parseInt(currentSelMainElement.style.pixelTop);
}
//对齐指定类型的控件
for (var i=0; i<arrElments.length; i++){
if (arrElments[i].ctrltype == "label"){
arrElments[i].style.pixelTop=posTop + 4;
}else if (arrElments[i].ctrltype == "text"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "image"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "pageimg"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "imageForBinCol"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "imageForDirFile"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "imageForUrlCol"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "fileForDirFile"){
arrElments[i].style.pixelTop=posTop;
//}else if (arrElments[i].ctrltype == "imagefile"){
// arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "file"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "ddlist"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "TextboxInPrint"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "radio"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "checkgrp"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "ResTable"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "line"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "cmsbtn"){
arrElments[i].style.pixelTop=posTop;
}else if (arrElments[i].ctrltype == "linkbtn"){
arrElments[i].style.pixelTop=posTop;
}
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//元素左对齐
function AlignLeft(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelLeft);
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelLeft=pos;
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//元素右对齐
function AlignRight(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelLeft) + parseInt(currentSelMainElement.style.pixelWidth);
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelLeft=pos - parseInt(arrElments[i].style.pixelWidth)
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//宽度对齐
function AlignWidth(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelWidth);
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelWidth=pos;
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//高度对齐
function AlignHeight(){
IsDesignChanged=true
try{
var pos = parseInt(currentSelMainElement.style.pixelHeight);
if (pos<=0){
pos = 20; //有些元素无法获取高度,默认为20pixel
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.pixelHeight=pos;
}
}catch(ex){
}
/*
清除所有选中元素相关的参数
将来改进:不清除所有选中元素相关的参数,但是需要同时移动所有定位点,以便于用户对齐后的一起移动操作
*/
//Hide4Dots(); //隐藏主元素的4个定位点
//DeleteDynamicAddedDots(); //移除动态添加显示的定位点
//ClearSelElementArray(); //移除所有元素的选择,其实是从全局数组中移除
}
//元素内部文字左对齐
function TextAlignLeft(){
IsDesignChanged=true
try{
if (currentSelMainElement != null){
currentSelMainElement.style.textAlign = "left"
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.textAlign = "left"
}
}catch(ex){
}
}
//元素内部文字右对齐
function TextAlignRight(){
IsDesignChanged=true
try{
if (currentSelMainElement != null){
currentSelMainElement.style.textAlign = "right"
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.textAlign = "right"
}
}catch(ex){
}
}
//元素内部文字居中对齐
function TextAlignCenter(){
IsDesignChanged=true
try{
if (currentSelMainElement != null){
currentSelMainElement.style.textAlign = "center"
}
for (var i=0; i<arrElments.length; i++){
arrElments[i].style.textAlign = "center"
}
}catch(ex){
}
}
//鼠标Over事件入口
function EvtMouseOver(){
try{
if (event.srcElement.dragSign=="frmElement"){
event.srcElement.style.cursor = "move"; //鼠标移至元素上时显示“鼠标移动”标志
}
}catch(ex){
}
}
//键盘击键的事件响应入口
function EvtKeyDown(){
try{
if (event.keyCode == 46){ //键盘Del键
IsDesignChanged=true
DeleteElement();
}
}catch(ex){
}
}
//放开鼠标的事件入口
function EvtMouseUp(){
try{
if (IsDraging == false){
return;
}
IsDraging=false
//定位主选择元素
currentSelMainElement.xx = currentSelMainElement.style.pixelLeft
currentSelMainElement.yy = currentSelMainElement.style.pixelTop
//定位主选择元素的4个定位点
frmInputDesign.left_mid.xx = frmInputDesign.left_mid.style.pixelLeft
frmInputDesign.left_mid.yy = frmInputDesign.left_mid.style.pixelTop
frmInputDesign.middle_top.xx = frmInputDesign.middle_top.style.pixelLeft
frmInputDesign.middle_top.yy = frmInputDesign.middle_top.style.pixelTop
frmInputDesign.middle_bot.xx = frmInputDesign.middle_bot.style.pixelLeft
frmInputDesign.middle_bot.yy = frmInputDesign.middle_bot.style.pixelTop
frmInputDesign.right_mid.xx = frmInputDesign.right_mid.style.pixelLeft
frmInputDesign.right_mid.yy = frmInputDesign.right_mid.style.pixelTop
//定位所有次选择元素
for (var i=0; i < arrElments.length; i++){
arrElments[i].xx = arrElments[i].style.pixelLeft
arrElments[i].yy = arrElments[i].style.pixelTop
}
//定位所有次选择元素的定位点
for (var i=0; i < arrDots.length; i++){
arrDots[i].xx = arrDots[i].style.pixelLeft
arrDots[i].yy = arrDots[i].style.pixelTop
}
//显示当前选中的元素的位置
if (currentSelMainElement != null){
//document.all.item("lblStatus1").innerText = "元素宽:" + currentSelMainElement.style.pixelWidth + " 高:" + currentSelMainElement.style.pixelHeight + " x:" + currentSelMainElement.style.pixelLeft + " y:" + currentSelMainElement.style.pixelTop
}
}catch(ex){
}
}
//添加标签元素
function AddElementLabel(){
IsDesignChanged=true
var lblValue = window.prompt("请输入标签显示内容:", "");
if (lblValue == null){
return; //用户点击了“取消”
}
var ctlName = "lbl" + Math.round(Math.random() * 10000000000);
var ctlLabel1 = document.createElement("<label ctrltype='label' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px '></label>");
ctlLabel1.innerText = lblValue;
panelForm.appendChild(ctlLabel1);
return false;
}
//添加"文件上传控件"元素
function AddElementFile(){
IsDesignChanged=true;
var ctlName = "CmsFile" + Math.round(Math.random() * 10000000000);
var ctlFile1 = document.createElement("<INPUT ctrltype='file' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' type='file' id='" + ctlName + "' name='" + ctlName + "' dragSign='fileElement' disabled style='Z-INDEX: 103; POSITION: absolute; LEFT: 97px; TOP: 5px; WIDTH: 222px'>");
panelForm.appendChild(ctlFile1);
return true;
}
function AddElementButton(){
IsDesignChanged=true
var btnValue = window.prompt("请输入按钮名称:", "");
if (btnValue == null){
return; //用户点击了“取消”
}
var ctlName = "cmsbtn" + Math.round(Math.random() * 10000000000);
var ctlBtn = document.createElement("<INPUT type=button value=" + btnValue + " ctrltype='cmsbtn' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px'>");
panelForm.appendChild(ctlBtn);
return false;
}
function AddElementLinkbtn(){
IsDesignChanged=true
var btnValue = window.prompt("请输入链接名称:", "");
if (btnValue == null){
return; //用户点击了“取消”
}
var ctlName = "linkbtn" + Math.round(Math.random() * 10000000000);
var ctlBtn = document.createElement("<INPUT type=button value=" + btnValue + " ctrltype='linkbtn' ctrlscript='' ctrlreadonly='0' ctrlbitian='0' id='" + ctlName + "' name='" + ctlName + "' dragSign='frmElement' readonly style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px'>");
//var ctlBtn = document.createElement("<a id='" + ctlName + "' style='POSITION: absolute; HEIGHT: 20px; WIDTH: 65px;top:5px;left:97px'>" + btnValue + "</a>");
panelForm.appendChild(ctlBtn);
return false;
}
function AddElementScript(){
IsDesignChanged=true;
try{
if (currentSelMainElement == null){
return false;
}
var rtnVal = window.showModalDialog("/cmsweb/cmsform/FormSetElementScript.aspx?ctrlscript=" + currentSelMainElement.ctrlscript, "_blank", "dialogHeight:430px; dialogWidth:580px; center;yes");
var strRtn = new String(rtnVal);
currentSelMainElement.ctrlscript = strRtn;
//if (strRtn != ""){
// var pos1 = strRtn.indexOf("$PROPNAME", 0)
// var pos2 = strRtn.indexOf("$PROPVAL", 0)
// if (pos1 >= 0 && pos2 >= 0){
// var strPropName = strRtn.substring(pos1+10, pos2)
// var strPropValue = strRtn.substring(pos2+9)
// currentSelMainElement.ctrlscript = strPropValue;
// }
//}
}catch(ex){
alert("请选择有效的控件!");
}
}
function SetFormProperty(){
//IsDesignChanged=true;
try{
//获取当前资源ID
//window.showModalDialog("/cmsweb/cmsform/FormSetProperty.aspx?mnures>script>
1 <div id="panelForm" style="border-width:1px;border-style:solid;height:148px;width:512px;Z-INDEX: 103; LEFT: 160px; POSITION: absolute; TOP: 136px">
2
3 <IMG id="left_mid" style="DISPLAY: none; WIDTH: 6px; CURSOR: w-resize; POSITION: absolute; HEIGHT: 6px"
4 height="6" src="images/dot.jpg" width="6" name="left_mid" dragSign="left_mid">
5 <IMG id="middle_top" style="DISPLAY: none; WIDTH: 6px; CURSOR: n-resize; POSITION: absolute; HEIGHT: 6px"
6 height="6" src="images/dot.jpg" width="6" name="middle_top" dragSign="middle_top">
7 <IMG id="middle_bot" style="DISPLAY: none; WIDTH: 6px; CURSOR: s-resize; POSITION: absolute; HEIGHT: 6px"
8 height="6" src="images/dot.jpg" width="6" name="middle_bot" dragSign="middle_bot">
9 <IMG id="right_mid" style="DISPLAY: none; WIDTH: 6px; CURSOR: e-resize; POSITION: absolute; HEIGHT: 6px"
10 height="6" src="images/dot.jpg" width="6" name="right_mid" dragSign="right_mid">
11 <span id="lbl_314291914783" name="lbl_314291914783" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:24px;left:10px;">文件上传</span><input name="TAB309435499140___CmsFileDoc" id="TAB309435499140___CmsFileDoc" type="file" dragSign="fileElement" ctrltype="file" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:20px;left:72px;" disabled="disabled" /><span id="Span1" name="lbl_314291914814" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:46px;left:10px; TEXT-ALIGN: right;FONT-SIZE: 12px;">编号</span><input name="TAB309435499140___FLOWCODE" type="text" value="[编号]" id="TAB309435499140___FLOWCODE" tabindex="-1" dragSign="frmElement" ctrltype="text" ctrlreadonly="0" ctrlbitian="0" maxLength="20" readOnly="true" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:42px;left:72px; TEXT-ALIGN: left;FONT-SIZE: 12px;" /><span id="Span2" name="lbl_314291914846" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:68px;left:10px; TEXT-ALIGN: right;FONT-SIZE: 12px;">关键字</span><input name="TAB309435499140___DOC2_KEYWORDS" type="text" value="[关键字]" id="TAB309435499140___DOC2_KEYWORDS" tabindex="-1" dragSign="frmElement" ctrltype="text" ctrlreadonly="0" ctrlbitian="0" maxLength="200" readOnly="true" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:64px;left:72px; TEXT-ALIGN: left;FONT-SIZE: 12px;" /><span id="Span3" name="lbl_314291914877" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:90px;left:10px; TEXT-ALIGN: right;FONT-SIZE: 12px;">备注</span><input name="TAB309435499140___DOC2_COMMENTS" type="text" value="[备注]" id="TAB309435499140___DOC2_COMMENTS" tabindex="-1" dragSign="frmElement" ctrltype="text" ctrlreadonly="0" ctrlbitian="0" maxLength="200" readOnly="true" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:86px;left:72px; TEXT-ALIGN: left;FONT-SIZE: 12px;" />
12 </div>
2
3 <IMG id="left_mid" style="DISPLAY: none; WIDTH: 6px; CURSOR: w-resize; POSITION: absolute; HEIGHT: 6px"
4 height="6" src="images/dot.jpg" width="6" name="left_mid" dragSign="left_mid">
5 <IMG id="middle_top" style="DISPLAY: none; WIDTH: 6px; CURSOR: n-resize; POSITION: absolute; HEIGHT: 6px"
6 height="6" src="images/dot.jpg" width="6" name="middle_top" dragSign="middle_top">
7 <IMG id="middle_bot" style="DISPLAY: none; WIDTH: 6px; CURSOR: s-resize; POSITION: absolute; HEIGHT: 6px"
8 height="6" src="images/dot.jpg" width="6" name="middle_bot" dragSign="middle_bot">
9 <IMG id="right_mid" style="DISPLAY: none; WIDTH: 6px; CURSOR: e-resize; POSITION: absolute; HEIGHT: 6px"
10 height="6" src="images/dot.jpg" width="6" name="right_mid" dragSign="right_mid">
11 <span id="lbl_314291914783" name="lbl_314291914783" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:24px;left:10px;">文件上传</span><input name="TAB309435499140___CmsFileDoc" id="TAB309435499140___CmsFileDoc" type="file" dragSign="fileElement" ctrltype="file" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:20px;left:72px;" disabled="disabled" /><span id="Span1" name="lbl_314291914814" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:46px;left:10px; TEXT-ALIGN: right;FONT-SIZE: 12px;">编号</span><input name="TAB309435499140___FLOWCODE" type="text" value="[编号]" id="TAB309435499140___FLOWCODE" tabindex="-1" dragSign="frmElement" ctrltype="text" ctrlreadonly="0" ctrlbitian="0" maxLength="20" readOnly="true" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:42px;left:72px; TEXT-ALIGN: left;FONT-SIZE: 12px;" /><span id="Span2" name="lbl_314291914846" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:68px;left:10px; TEXT-ALIGN: right;FONT-SIZE: 12px;">关键字</span><input name="TAB309435499140___DOC2_KEYWORDS" type="text" value="[关键字]" id="TAB309435499140___DOC2_KEYWORDS" tabindex="-1" dragSign="frmElement" ctrltype="text" ctrlreadonly="0" ctrlbitian="0" maxLength="200" readOnly="true" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:64px;left:72px; TEXT-ALIGN: left;FONT-SIZE: 12px;" /><span id="Span3" name="lbl_314291914877" dragSign="frmElement" ctrltype="label" ctrlreadonly="0" ctrlbitian="0" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 56px;top:90px;left:10px; TEXT-ALIGN: right;FONT-SIZE: 12px;">备注</span><input name="TAB309435499140___DOC2_COMMENTS" type="text" value="[备注]" id="TAB309435499140___DOC2_COMMENTS" tabindex="-1" dragSign="frmElement" ctrltype="text" ctrlreadonly="0" ctrlbitian="0" maxLength="200" readOnly="true" style="POSITION: absolute; HEIGHT: 20px; WIDTH: 400px;top:86px;left:72px; TEXT-ALIGN: left;FONT-SIZE: 12px;" />
12 </div>
</form>
</body>
</HTML>
效果图如下:
鼠标移上去选中相应控件即可拖动,如操作窗体控件一样方便。