JMJS系统总结系列----JMJS中使用到的Jquery工具(四)

Datepicker时间控件的使用

A、在需要调用对话框的页面标签中引入。

<script type="text/javascript" src="JS/datepicker/WdatePicker.js" > </script>

B、在文本框中加入时间控件的样式(class="Wdate")和事件调用οnclick="javascript:WdatePicker();"。

artDialog对话框控件

A、 在public.js中将artDialog的相关方法进行封装。

//****************************************************

// 名 称:initSkin

// 说 明:初始化art.dialog的Skin

// 参 数:无

// 返 回 值:无

//****************************************************

function initSkin() {

var d = art.dialog.defaults;

// 按需加载要用到的皮肤,数组第一个为默认皮肤

// 如果只使用默认皮肤,可以不填写skin

d.skin = ['chrome', 'default', 'facebook', 'aero'];

}

//****************************************************

// 名 称:showAlertDialog

// 说 明:弹出Alert

// 参 数:content:内容(html); fun:点击确定按钮后执行的方法,此参数可以省略

// 返 回 值:无

//****************************************************

function showAlertDialog(content, fun) {

art.dialog({

icon: 'alert',

lock: true,

skin: 'chrome',

window: 'top',

title: '提示',

content: content,

yesFn: fun == undefined ? true : fun

});

}

//****************************************************

// 名 称:showOKDialog

// 说 明:弹出succeed的Alert

// 参 数:content:内容(html); fun:点击确定按钮后执行的方法,此参数可以省略

// 返 回 值:无

//****************************************************

function showOKDialog(content, fun) {

art.dialog({

icon: 'succeed',

lock: true,

window: 'top',

skin: 'chrome',

title: '成功',

content: content,

yesFn: fun == undefined ? true : fun

});

}

//****************************************************

// 名 称:showErrorDialog

// 说 明:弹出Error的Alert

// 参 数:content:内容(html); fun:点击确定按钮后执行的方法,此参数可以省略

// 返 回 值:无

//****************************************************

function showErrorDialog(content, fun) {

art.dialog({

icon: 'error',

lock: true,

skin: 'chrome',

title: '出错',

window: 'top',

content: content,

yesFn: fun == undefined ? true : fun

});

}

//****************************************************

// 名 称:showWarningDialog

// 说 明:弹出警告的Alert

// 参 数:content:内容(html); fun:点击确定按钮后执行的方法,此参数可以省略

// 返 回 值:无

//****************************************************

function showWarningDialog(content, fun) {

art.dialog({

icon: 'error',

lock: true,

skin: 'chrome',

title: '警告',

window: 'top',

content: content,

yesFn: fun == undefined ? true : fun

});

}

//****************************************************

// 名 称:showConfirm

// 说 明:弹出Confirm的Dialog

// 参 数:content 内容,funYes 确定函数,funNo 取消函数

// 返 回 值:无

//****************************************************

function showConfirm(content, funYes, funNo) {

art.dialog({

lock: true,

icon: 'confirm',

skin: 'chrome',

content: content,

title: '询问',

yesFn: function() {

funYes();

},

noFn: function() {

funNo();

}

});

}

B、 在需要调用对话框的页面标签中引入

<script type="text/javascript" src="JS/artDialog/artDialog.min.js" > </script>

<script type="text/javascript" src="JS/public.js" > </script>

C、 调用需要使用的地方调用封装后的方法。

//****************************************************

// 名 称: CancelConfirm

// 说 明: 点击取消按钮时,进行相关的提示。

// 参 数:

// 返 回 值: 无

//****************************************************

function CancelConfirm() {

if (isChange) {

showConfirm('如果未保存数据,取消时将丢失。确定要取消吗?', function() {

window.close();

},

function() { });

}

else

window.close();

}

注意:也可以使用没有封装的方法

//****************************************************

// 名 称: OpenFlowWorkLookOverPage

// 说 明: 查看流程

// 参 数: 无

// 返 回 值: 无

//****************************************************

function OpenFlowWorkLookOverPage() {

var acceptID = GetElementValue("Accept/AcceptID");

var instanceID = GetElementValue("Accept/InstanceID");

var flowBaseID = GetElementValue("Accept/FlowBaseID");

var finished = GetElementValue("Accept/IsFinished");

var contentHtml = "";

var ajaxUrl = viewWorkFlowUrl + acceptID + "&InstanceID=" + instanceID + "&FlowBaseID=" + flowBaseID + "&IsFinished=" + finished

$.ajax({

url: ajaxUrl,

success: function(html) {

contentHtml = html;

art.dialog({ title: '查看流程', skin: 'chrome', width: '460px', height: '480px', lock: true, fixed: true, content: contentHtml, id: 'workFlowLookOverPage' });

},

error: function(xmlhttprequest, textstatus, errorthrown) {

defineWarmAlert("error!", false);

}

});

}

Editor文本编辑控件

A、 在需要调用对话框的页面标签中引入。

<script type="text/javascript" src="JS/editor/kindeditor.js" ></script>

B、 在页面上调用

//****************************************************

// 名 称:EditPublicity

// 说 明:新增、编辑公示

// 参 数:无

// 返 回 值:无

//****************************************************

function EditPublicity(id)

{

KE.init({

id : 'content',

items : ['source', '|', 'fullscreen', 'undo', 'redo', 'print', 'cut', 'copy', 'paste','plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright','justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript','superscript', '|', 'selectall', '-','title', 'fontname', 'fontsize', '|', 'textcolor', 'bgcolor', 'bold','italic', 'underline', 'strikethrough', 'removeformat', '|', 'image','flash', 'media', 'advtable', 'hr', 'emoticons', 'link', 'unlink', '|', 'about'],

afterCreate : function(id) {

KE.util.focus(id);

}

});

art.dialog(

{

title: '新增、编辑公示',

width: '720px',

height: '320px',

content:'',

skin: 'chrome',

yesFn: function() {

document.getElementById(id).value = KE.html('content');

}

});

KE.create('content');

if(document.getElementById(id).value != "")

{

KE.html('content',document.getElementById(id).value);

}

}

Tree控件的使用

A、 在需要调用对话框的页面标签中引入。

<script type="text/javascript" src="JS/Tree/codebase/dhtmlxcommon.js" ></script>

<script type="text/javascript" src="JS/Tree/codebase/dhtmlxtree.js" ></script>

B、 在页面上调用

//****************************************************

// 名 称: initTree

// 说 明: 根据传入的xml数据,重新初始化树。

// 参 数: xml

// 返 回 值: 无

//****************************************************

function initTree(xml)

{

tree=null;

$("#ReceiveUse_tree").html("");

tree = new dhtmlXTreeObject("ReceiveUse_tree", "100%", "100%", 0);

tree.preventIECaching(true);

tree.setSkin('dhx_skyblue');

tree.setImagePath("JS/Tree/codebase/imgs/csh_bluebooks/");

tree.enableHighlighting(true);

tree.setOnClickHandler(tonclick);

tree.setOnDblClickHandler(tondblclick);

tree.loadXMLString(xml);

}

//****************************************************

// 名 称: SelectLink

// 说 明: 选择环节时,更新当前环节的办理人员。

// 参 数: contentHtml

// 返 回 值: 无

//****************************************************

function SelectLink()

{

var nodeID = document.getElementById("FlowWorkBook/NodeID").value;

$.ajax({

url: "Organization.do?action=GetOrganizatIonincludeUserTreeXML",

cache: false,

data: "NodeId=" + nodeID,

type: "POST",

ContentType: "text/xml;UTF-8",

success: function(xml) {

initTree(xml);

$("#FlowReceiveUser").html("");

}

});

}

转载于:https://www.cnblogs.com/lanchong/archive/2011/08/31/2160496.html

你可能感兴趣的:(JMJS系统总结系列----JMJS中使用到的Jquery工具(四))