Dojo Grid结合Ajax用法
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CustomerDefinedOutputField.aspx.cs" Inherits="SparkBiz.Payroll.CustomerDefinedOutputField" %>
<style>
@import "../public/prod1.5.37.1/dojo1.5/dijit/themes/claro/claro.css";
@import "../public/prod1.5.37.1/dojo1.5/dijit/themes/soria/soria.css";
@import "../public/prod1.5.37.1/dojo1.5/dijit/themes/nihilo/nihilo.css";
@import "../public/prod1.5.37.1/dojo1.5/dijit/themes/tundra/tundra.css";
@import "../public/prod1.5.37.1/dojo1.5/dojo/resources/dojo.css";
@import "../public/prod1.5.37.1/dojo1.5/dojox/grid/enhanced/resources/claroEnhancedGrid.css";
@import "../public/prod1.5.37.1/dojo1.5/dojox/grid/enhanced/resources/EnhancedGrid_rtl.css";
@import "../public/prod1.5.37.1/dojo1.5/dijit/themes/claro/document.css"; #gridList
{
width:100%;
height:556px;
border:1px solid silver;
}
.spanClass {
color:red
}
</style> <div id="ListRoot" style="position:absolute; top:20px; width:100%;">
</div>
<script src="Modules/Payroll/JS/json2.js" type="text/javascript"></script>
<script type="text/javascript">
dojo.require("dijit.layout.SplitContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("revit.form.Button");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dojo.parser");
</script> <%--Group类别样式--%>
<style type="text/css">
#ulGroup
{
font:12px verdana, arial, sans-serif;
}
#ulGroup li a
{
display:block;
padding:8px 20px;
text-decoration:none;
}
#ulGroup li a:hover
{
background:#4aabbe;
color:#fff;
text-decoration:none;
}
</style>
<%--构造列结构以及绑定控件事件--%>
<script type="text/javascript">
var gridCells =
[
{
field: "PRBatchFieldName",
name: "<%=RM.GetString("HeadDefinedYlX") %>",
width: "200px"
},
{
field: "TableName",
name: "<% = RM.GetString("TableName") %>",
formatter: SetTablesHtml,
width: "170px"
},
{
field: "FieldName",
name: "<% = RM.GetString("FieldName") %>",
formatter: SetFilesHtml,
width: "300px"
},
{
field: "LookUpField",
name: "LookUp",
formatter: SetLookUpHtml,
width: "200px"
}
]; //设置TableName样式
function SetTablesHtml(value, rowIndex) {
var grid = dijit.byId("gridList");
var index = grid.store.getValue(grid.getItem(rowIndex), "Index");
value = datas.items[index].TableName;
var selTabName = datas.items[index].selTabName;
var GroupName = datas.items[index].GroupName;
var innerHtml = "";
var array = value.toString().split(",");
if (GroupName == "Defined") {
innerHtml += "<select id='selTab" + index + "' style=\"width:100%;\;font-family:Tahoma;font-size:11px\" onchange=\"selectTable_onchange_click(this,'" + index + "')\">";
for (var i = 0; i < array.length; i++) {
var selStr = "";
if (array[i] == selTabName)
selStr = "selected=selected";
innerHtml += "<option " + selStr + " value = '" + array[i] + "'>" + array[i] + "</option>";
}
innerHtml += "</select>";
}
else {
gridCells[0].width = "200px";
innerHtml += "<span style=\"width:100%\">";
innerHtml += array[0];
innerHtml += "</span>";
}
return innerHtml;
} //设置Filed样式
function SetFilesHtml(value, rowIndex) {
var grid = dijit.byId("gridList");
var index = grid.store.getValue(grid.getItem(rowIndex), "Index");
value = datas.items[index].FieldName;
var selFieldName = datas.items[index].SelFieldName;
var GroupName = datas.items[index].GroupName;
var innerHtml = "";
var array = value.toString().split(",");
if (GroupName == "Defined") {
innerHtml += "<select id='selField" + index + "' style=\"width:100%;\font-family:Tahoma;font-size:11px\" onchange=\"selectField_onchange_click(this,'" + index + "')\">";
for (var i = 0; i < array.length; i++) {
var selStr = "";
if (array[i].split("/")[0] == selFieldName)
selStr = "selected=selected";
innerHtml += "<option " + selStr + " value = '" + array[i] + "'>" + array[i] + "</option>";
}
innerHtml += "</select>";
}
else {
innerHtml += "<span style=\"width:100%\">";
innerHtml += array[0];
innerHtml += "</span>";
}
return innerHtml;
} //设置LookUp样式
function SetLookUpHtml(value, rowIndex) {
var grid = dijit.byId("gridList");
var index = grid.store.getValue(grid.getItem(rowIndex), "Index");
value = datas.items[index].LookUpField;
var selLookup = datas.items[index].selLookup;
var GroupName = datas.items[index].GroupName;
var array = value.toString().split(",");
var innerHtml = "";
if (GroupName == "Defined") {
if (selLookup == "") {
innerHtml += "<select id='sellookup" + index + "' style=\"width:100%;\font-family:Tahoma;font-size:11px;display:none\" onchange=\"selectLookUp_onchange_click(this,'" + index + "')\">";
}
else {
innerHtml += "<select id='sellookup" + index + "' style=\"width:100%;\font-family:Tahoma;font-size:11px\" onchange=\"selectLookUp_onchange_click(this,'" + index + "')\">";
}
for (var i = 0; i < array.length; i++) {
var selStr = "";
if (array[i].split("/")[0] == selLookup) {
selStr = "selected=selected";
}
innerHtml += "<option " + selStr + " value = '" + array[i] + "'>" + array[i] + "</option>";
}
innerHtml += "</select>";
}
else {
innerHtml += "<span style=\"width:100%\">";
innerHtml += array[0];
innerHtml += "</span>";
}
return innerHtml;
} //Table Onchange事件
function selectTable_onchange_click(obj, rowIndex) {
//返回TableName值给jasonMain
datas.items[rowIndex].selTabName = obj.value; //找寻该表下的字段
SelectFieldByTable(obj.value, rowIndex);
} //Field Onchange事件
function selectField_onchange_click(obj, rowIndex) {
var fieldValue = obj.value.split("/")[0].toString();
if (fieldValue == null) { return false; }
//获取TableName
var seltableObj = document.getElementById("selTab" + rowIndex); //返回Field值给jasonMain
datas.items[rowIndex].SelFieldName = fieldValue;
SelectLookUpOrPickList(seltableObj.value, obj.value, rowIndex);
} //LookUp Onchange事件
function selectLookUp_onchange_click(obj, rowIndex) {
//返回LookUp值给jasonMain
datas.items[rowIndex].selLookup = obj.value.split("/")[0];
} </script> <%--事件处理方法--%>
<script>
var datas;
//生成数据Table
function SetDataSource(jsonObj, jsonGroup) {
datas = {
identifier: 'id',
label: 'id',
items: []
}; var i, len;
for (i = 0, len = jsonObj.length; i < len; ++i) {
datas.items.push(dojo.mixin({ 'id': i + 1 }, jsonObj[i % len]));
} var store = new dojo.data.ItemFileWriteStore({ data: datas }); var gridList;
gridList = new dojox.grid.DataGrid({
id: 'gridList',
canSort: false,//禁用列头排序功能
store: store,
structure: gridCells
}); gridList.placeAt('grid');
gridList.startup(); SetDataSourceByGroup("Defined");
} //判断字段是否已经被选择
function IsSelectdByField(TableName, FiledName, rowIndex) {
var arrays = new Array();
var dataItems = datas.items;
for (var i = 0; i < dataItems.length; i++) {
if (dataItems[i].GroupName != "Defined") { continue; }
if (dataItems[i].SelFieldName == null || dataItems[i].SelFieldName == undefined || dataItems[i].SelFieldName == "" || dataItems[i].SelFieldName == "undefined")
{ continue; }
if (dataItems[i].selTabName == TableName && dataItems[i].SelFieldName == FiledName) {
return true;
break;
}
}
return false;
} //查找字段通过TableName
function SelectFieldByTable(TableName, rowIndex) {
var FieldStr = null;
var flg = false;
var xhrObj = {
url: HRnet.Environment.webServerRoot + "/Modules/Payroll/PayrollHandler.ashx?action=SearchFiledByTableName",
timeout: 50000,
handleAs: "json",
content: { "TableName": TableName },
form: null,
sync: true
};
//发起ajax请求
var def = dojo.xhrPost(xhrObj);
def.then(function (resp) {
if (resp) {
//操作响应数据
flg = true;
FieldStr = resp.FieldStr;
}
}, function (err) { alert(err); }); //赋值
datas.items[rowIndex].FieldName = FieldStr; if (FieldStr === null) { ClearDataAll(rowIndex); return; } //清除PickList和LookUp数据
ClearData(rowIndex); // 重新生成子阶option
addoptions("Table", "selField", rowIndex, FieldStr);
} //清空PickList和LookUp
function ClearData(rowIndex) {
//清除PickList和LookUp数据
var selLookUpObj = document.getElementById("sellookup" + rowIndex);
selLookUpObj.options.length = 0;
} //清空Field和PickList和LookUp
function ClearDataAll(rowIndex) {
//清除PickList和LookUp数据
var selFieldObj = document.getElementById("selField" + rowIndex);
selFieldObj.options.length = 0;
datas.items[rowIndex].SelFieldName = ""; //清除PickList和LookUp数据
var selLookUpObj = document.getElementById("sellookup" + rowIndex);
selLookUpObj.options.length = 0;
datas.items[rowIndex].selLookup = "";
document.getElementById("sellookup" + rowIndex).style.display = "none";
} //获取PickList或者LookUP
function SelectLookUpOrPickList(TableName, FiledName, rowIndex) {
var FieldStr = "";
var FieldType = "";
var flg = false;
var xhrObj = {
url: HRnet.Environment.webServerRoot + "/Modules/Payroll/PayrollHandler.ashx?action=SearchFiledByFileName",
timeout: 50000,
handleAs: "json",
content: { "FiledName": FiledName, "TableName": TableName },
form: null,
sync: true
};
//发起ajax请求
var def = dojo.xhrPost(xhrObj);
def.then(function (resp) {
if (resp) {
//操作响应数据
flg = true;
FieldStr = resp.FieldStr;
FieldType = resp.jasonType;
}
}, function (err) { alert(err); }); var selFieldObj = null;
switch (FieldType) {
case "8"://LookUp
selFieldObj = "sellookup";
document.getElementById(selFieldObj + rowIndex).style.display = "";
break;
default:
document.getElementById("sellookup" + rowIndex).style.display = "none";
return;
} //赋值给选择的LookUp
datas.items[rowIndex].LookUpField = FieldStr; //清除PickList和LookUp数据
ClearData(rowIndex); if (selFieldObj == null) { return; } // 重新生成子阶option
addoptions(FieldType, selFieldObj, rowIndex, FieldStr);
} //添加Options
function addoptions(type, parentId, rowIndex, subarray) {
//获取父阶
var selFieldObj = document.getElementById(parentId + rowIndex);
//清除父阶
selFieldObj.options.length = 0;
//添加子阶
var array = subarray.toString().split(",");
for (var i = 0; i < array.length; i++) {
selFieldObj.options.add(new Option(array[i], array[i]));
}
if (array != null) {
switch (type) {
case "Table":
datas.items[rowIndex].SelFieldName = array[0].toString().split("/")[0].toString();
break;
case "8":
datas.items[rowIndex].selLookup = array[0].toString().split("/")[0].toString();
break;
default:
}
}
} //初始事件
function initPage_Load() {
var jsonMain = "";
var jsonTable = "";
var jsonGroup = "";
var flg = false;
var xhrObj = {
url: HRnet.Environment.webServerRoot + "/Modules/Payroll/PayrollHandler.ashx?action=SearchDefineOutPutField",
timeout: 50000,
handleAs: "json",
form: null,
sync: true
};
//发起ajax请求
var def = dojo.xhrPost(xhrObj);
def.then(function (resp) {
if (resp) {
//操作响应数据
flg = true;
jsonMain = resp.jsonMain;
jsonGroup = resp.jsonGroup;
jsonTable = resp.jsonTable;
}
}, function (err) { alert(err); }); //生成Group
SetDataGroup(jsonGroup);
//定义第一个列类别，默认显示
var firstGroup = "";
if (jsonGroup.length > 0)
firstGroup = jsonGroup[0].GroupName;
//生成数据Table
SetDataSource(jsonMain, firstGroup);
} revit.addOnLoad(_container_, function () {
initPage_Load();
}); var arrayGroup;
//选择Group类别,过滤数据
function SetDataSourceByGroup(groupName) {
var grid = dijit.byId("gridList");
grid.focus.setFocusIndex(0, 1);
grid.setQuery({ GroupName: "" + groupName + "" });
} //单击Group类别,设置样式,过滤数据
function GroupClick(obj, value) {
if (value == "自定义") { value = "Defined"; }
if (value == "标准") { value = "Standard"; } //if(value == "Standard"){SaveDataByGroupClick();}
dojo.query("a").forEach(function (node, i) {
node.style.backgroundColor = "";
node.style.color = "";
});;
obj.style.backgroundColor = "#4aabbe";
obj.style.color = "#fff"; //数据过滤
SetDataSourceByGroup(value);
} //生成Group类别
function SetDataGroup(jsonObj) {
arrayGroup = new Array();
var ulInnerHtml = "";
var groupObj = document.getElementById("ulGroup");
if (jsonObj != "") {
var spanHtml = "";
for (var i = 0; i < jsonObj.length; i++) {
var groupName = jsonObj[i].GroupName; //类别名称
arrayGroup.push(groupName);
if (i == 0) {
ulInnerHtml += "<li><a href=\"#\" style=\"background-color:#4aabbe;color:#fff\" onclick=\"GroupClick(this,'" + groupName + "')\">" + groupName + "</a></li>";
spanHtml += "<span id=\"span" + groupName + "\" style=\"color:red;font-size:12px\" >" + groupName + "</span>";
}
else {
ulInnerHtml += "<li><a href=\"#\" onclick=\"GroupClick(this,'" + groupName + "')\">" + groupName + "</a></li>";
spanHtml += "<span id=\"span" + groupName + "\" style=\"display:none;color:red;font-size:12px\">" + groupName + "</span>";
}
}
}
groupObj.innerHTML = ulInnerHtml;
} //定义回传数据
function ItemsToJsonString() {
var arrays = new Array();
var dataItems = datas.items;
for (var i = 0; i < dataItems.length; i++) {
if (dataItems[i].GroupName != "Defined") { continue; }
//if (dataItems[i].SelFieldName == null || dataItems[i].SelFieldName == undefined || dataItems[i].SelFieldName == "" || dataItems[i].SelFieldName == "undefined")
//{ continue; }
var obj = new Object();
obj.ZHPR_DEFINEDTABLE = dataItems[i].selTabName;
obj.ZHPR_DEFINEDFILED = dataItems[i].SelFieldName;
obj.ZHPR_MAPPINGOBJECT = "ZHPR_PRBATCHEMPLOYEEPROFILEDATA." + dataItems[i].PRBatchFieldName;
obj.ZHPR_LOOKUPFILED = dataItems[i].selLookup;
obj.ZHPR_PICKLISTFILED = "";//dataItems[i].selPicklist;
arrays.push(obj);
}
return JSON.stringify(arrays);
} //获取需要保存的数据个数
function GetSaveCount() {
var count = 0;
var dataItems = datas.items;
for (var i = 0; i < dataItems.length; i++) {
if (dataItems[i].SelFieldName == null || dataItems[i].SelFieldName == undefined || dataItems[i].SelFieldName == "" || dataItems[i].SelFieldName == "undefined")
{ continue; }
count++;
}
return count;
} // 保存数据
function SaveData() {
//if (GetSaveCount() < 1) { alert("<%=RM.GetString("NotDataSave")%>"); return false; }
var flg = "F";
//定义ajax请求对象的属性
var xhrObj = {
url: HRnet.Environment.webServerRoot + "/Modules/Payroll/PayrollHandler.ashx?action=SaveDefinedField",
timeout: 50000,
handleAs: "json",
content: { "dataJsonStr": ItemsToJsonString() },
form: null,
sync: true
};
//发起ajax请求
var def = dojo.xhrPost(xhrObj);
def.then(function (resp) {
if (resp) {
//操作响应数据
flg = resp.Message; //alert(resp.number);
}
}, function (err) { alert(err); return false; });
if (flg == "") { return false; }
dijit.byId('setImportTemplateForm').clearMessages();
if (flg == "T") {
dijit.byId("setImportTemplateForm").addInfoMessage('<%=RM.GetString("SaveSucceedMsg")%>');
}
else {
dijit.byId("setImportTemplateForm").addErrorMessage('<%=RM.GetString("SaveFailedMsg")%>');
}
setTimeout("dijit.byId('setImportTemplateForm').clearMessages();", 2000);
return false;
} function SaveDataByGroupClick() {
var flg = "F";
//定义ajax请求对象的属性
var xhrObj = {
url: HRnet.Environment.webServerRoot + "/Modules/Payroll/PayrollHandler.ashx?action=SaveDefinedField",
timeout: 50000,
handleAs: "json",
content: { "dataJsonStr": ItemsToJsonString() },
form: null,
sync: true
};
//发起ajax请求
var def = dojo.xhrPost(xhrObj);
def.then(function (resp) {
if (resp) {
//操作响应数据
flg = resp.Message; //alert(resp.number);
}
}, function (err) { alert(err); return false; });
if (flg == "") { return false; }
return false;
} //返回
function GoBack() {
var url = HRnet.Environment.webServerRoot + "/Main.aspx/Home?dojo.preventCache=" + new Date();
HRnet.Revolution.Form.DirtyPageCheck(
function () {
if (HRnet.Revolution.Form.RedirectToParentForm(false, false, true)) { return; }
dijit.byId(HRnet.Revolution.Constants.Appcontainter).set("href", HRnet.Revolution.Form.CancelActionUrl, true);
},
url);
}
</script> <%--窗体结构--%>
<div id="setImportTemplateForm" onkeypress="keyPress" style="width:100%;" enctype="multipart/form-data" dojotype="revit.form.Form" method="post" canSort="false">
<br />
<input type="hidden" id="hfMSTRID" />
<div class="soria" style="width:98%;">
<font size="1" >
<div dojoType="dijit.layout.SplitContainer"
orientation="horizontal"
sizerWidth="7"
activeSizing="false"
style="border: 1px solid #bfbfbf; float: left; width: 100%; height: 600px;" canSort="false"> <div dojoType="dijit.layout.ContentPane" style="width:15%; background-color:#e5f1f1" id="prog_menu" >
<ul id="ulGroup"> </ul>
</div> <div id="divContent" dojoType="dijit.layout.ContentPane" style="width:85%;border:2px;" sizeMin="40" sizeShare="50" canSort="false">
<table style="width:100%">
<tr>
<td>
<div id="grid" canSort="false"> </div>
</td>
</tr>
</table>
</div> </div>
<button id="btnSave" dojotype="revit.form.Button" iconclass="save16" showlabel="true" onclick="return SaveData()"><%=RM.GetString("Save")%></button>
</font>
</div>
</div>
Dojo Grid结合Ajax用法的更多相关文章
- dojo grid 编辑问题
今天dojo grid编辑小问题,找了半天才找到问题, 1.问题 2.原因 数据单元没有索引列->id 3.修改前代码 <!DOCTYPE HTML> <html lang=& ...
- Ajax 用法
Ajax 用法 var total=100; var orderName='sssss'; var orderDescrib='dddd ...
- dojo grid 分页
dojo很强大,也很方便,但是缺少文档,只能看源代码,也挺好的,就是费时间... 网上找了一段代码(找不到原出处了,不好意思),也看了dojo自带的demo,放一段可以执行的页面代码这里.把ip换成自 ...
- jQuery $.post $.ajax用法
jQuery $.post $.ajax用法 jQuery.post( url, [data], [callback], [type] ) :使用POST方式来进行异步请求 参数: url (Stri ...
- [转]Jquery Ajax用法
原文地址:http://www.php100.com/html/program/jquery/2013/0905/6004.html jQuery学习之jQuery Ajax用法详解 来源: 时间 ...
- jQuery学习笔记之Ajax用法详解
这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...
- jQuery中的ajax用法案例
什么是 AJAX? AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML). 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载 ...
- ajax用法流程
这里是用javascript做的一个ajax的一个用法以及总结概括.供友友们进行参考. 1 window.onload=function() { var oBtn=document.getElemen ...
- java web 之 AJAX用法
AJAX :Asynchronous JavaScript And XML 指异步 JavaScript 及 XML一种日渐流行的Web编程方式 Better Faster User-Friendly ...
随机推荐
- Flutter Windows下AndroidStudio环境搭建
目前同类产品比较知名的有ReactNative,Flutter还有国内那家了uniapp了,流畅度理论上Flutter最快 官网:https://flutter.dev/docs/get-starte ...
- 165-PHP 文本替换函数str_replace（六）
<?php $str='programming'; //定义一个字符串 $replacement='er'; //定义替换的字符串 $res=substr_replace($str,$repla ...
- BeginInvoke之前检测句柄
只要在BeginInvoke方法的调用语句前再加一句:IntPtr i = this.Handle;就OK了,这比死循环配合this.IsHandleCreated的判断方法更简洁,因为this.Ha ...
- 干货分享：Research Essay写作规范详解
同学们在刚到国外时觉得一切都很新鲜,感觉到处都在吸引着他们,但是大部分留学生在刚碰到Research Essay便是一头包.其实Research Essay也没有想象中的那么难,只是留学生们初次接触, ...
- MongoDB 教程
版权所有,未经许可,禁止转载 章节 MongoDB 入门 MongoDB 优势 MongoDB 安装 MongoDB 数据建模 MongoDB 创建数据库 MongoDB 删除数据库 MongoDB ...
- hdu 1257 最少拦截系统 求连续递减子序列个数 （理解二分）
最少拦截系统 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Subm ...
- 编码对象或者字串中包含Unicode字符怎样转换为中文
In [18]: c = '你好' In [20]: d = c.encode('unicode_escape') In [21]: d Out[21]: b'\\u4f60\\u597d' In [ ...
- 2016蓝桥杯省赛C/C++A组第八题 四平方和
题意: 四平方和定理,又称为拉格朗日定理: 每个正整数都可以表示为至多4个正整数的平方和. 如果把0包括进去,就正好可以表示为4个数的平方和. 比如: 5 = 0^2 + 0^2 + 1^2 + 2^ ...
- 洛谷 P1776 宝物筛选(多重背包)
题目传送门 解题思路: 可以转化成0-1背包来做,但暴力转化的话,时间不允许.所以就用了一个二进制划分的方法,将m个物品分成2,4,8,16,32......(2的次方)表示,可以证明这些数通过一定组 ...
- HTTP协议、时间戳
1.什么是HTTP协议 超文本传输协议(英文:HyperText Transfer Protocol,缩写:HTTP)是一种用于分布式.协作式和超媒体信息系统的应用层协议.HTTP是万维网的数据通信的 ...