<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SA01.aspx.cs" Inherits="CCOA.DataUser.FrmCustom._098.SA01" %>
<!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 runat="server">
<title>营业部客户资料维护</title>
<style type="text/css">
.tooltab {
border: 1px solid #8DB2E3;
font-size: 12px;
height: 26px;
margin: 0;
padding:4px 0 0 4px;
width: 100%;
background-color: #E0ECFF;
}
.txtClass
{
border: 1px solid #8DB2E3;
width:200px;
height:20px
}
</style>
<link href="../JSCSS/Default.css" rel="stylesheet" type="text/css" />
<link href="../JSCSS/jquery-easyui-1.2.6/themes/default/easyui.css" rel="stylesheet"
type="text/css" />
<link href="../JSCSS/jquery-easyui-1.2.6/themes/icon.css" rel="stylesheet" type="text/css" />
<script src="../JSCSS/jquery-easyui-1.2.6/jquery-1.7.2.min.js" type="text/javascript"></script>//jquery-1.6.min.js中searchbox有问题
<script src="../JSCSS/jquery-easyui-1.2.6/jquery.easyui.min.js" type="text/javascript"></script>
<script src="../JSCSS/btns.js" type="text/javascript"></script>
<script type="text/javascript">
function trim(str) { //删除左右两端的空格
return str.replace(/(^\s*)|(\s*$)/g, "");
}
function fixWidthTable(percent) {
return getWidth(0.98) * percent;
}
function getWidth(percent) {
return $(window).width() * percent;
}
//弹出信息窗口 title:标题 msgString:提示信息 msgType:信息类型 [error,info,question,warning]
function msgShow(title, msgString, msgType) {
$.messager.alert(title, msgString, msgType);
}
var type = '';
$(function () {
$(window).resize(function () {
$("#tt").datagrid("resize", { width: getWidth(0.98) });
// $("#tt").datagrid({
// width: getWidth(0.98),
// height: document.getElementById('div1').heigh +100
// });
});
$('#dd').dialog({
closed: true,
modal: true, //类似模态窗口
title: '客户资料维护'
});
//设置datagrid加载后默认选中
var NCs = "";
$.post('../ashx/SA01.ashx?type=Checked&Id=&OID=' + getQueryStringByName("OID"), function (msg) {
NCs = msg.split(',');
});
initGrid('../ashx/SA01.ashx?type=load');
$('#tt').datagrid({ onLoadSuccess: function (data) {
var rowData = data.rows;
var rnc = "";
$.each(rowData, function (index, value) {
rnc = rowData[index]["Name"] + rowData[index]["Company"];
for (var i = 0; i < NCs.length; i++) {
if (rnc == NCs[i]) {
$("#tt").datagrid("selectRow", index);
}
}
});
}
});
//以上设置datagrid加载后默认选中
initGrid('../ashx/SA01.ashx?type=load');
initCompany();
//初始化搜索框
$("#txt_search").searchbox({
width: 200,
iconCls: 'icon-ok',
prompt: '请输入查询内容',
searcher: function (val, colName) {//搜索text执行函数
if (trim(val) != "") {
initGrid('../ashx/SA01.ashx?type=load&colName=' + colName + '&val=' + val)
}
else {
initGrid('../ashx/SA01.ashx?type=load')
}
}
});
});
function closedd() {
$('#dd').dialog('close');
}
function initGrid(urlVal) {
$('#tt').datagrid({
width: document.getElementById('div1').width,
height: document.getElementById('div1').heigh,
nowrap: false,
striped: true,
collapsible: true,
rownumbers: true, //行号
remoteSort: false,
singleSelect: true,
loadMsg: '数据加载中请稍后……',
pagination: false, //是否开启分页
pageNumber: 1, //默认索引页
pageSize: 20, //默认一页数据条数
sortName: 'Name',
sortName:'Company',
sortOrder: 'desc',
idField: 'Id',
url: urlVal,
onLoadSuccess: function (data) {
} ,
columns: [[
{ field: 'Id', title: 'Id', hidden: true },
{ field: 'Name', title: 'Name', width: 100, sortable: true },
{ field: 'Company', title: 'Company', width: fixWidthTable(0.15), sortable: true },
{ field: 'Dept', title: 'Dept', width:fixWidthTable(0.1) },
{ field: 'Title', title: 'Title', width: fixWidthTable(0.2) },
{ field: 'MobilePhone', title: 'MobilePhone', width:fixWidthTable(0.1) },
{ field: 'OfficePhone', title: 'OfficePhone', width: fixWidthTable(0.1) },
{ field: 'OtherPhone', title: 'OtherPhone', width: fixWidthTable(0.1) }
]]
});
}
function add() {
type = 'add';
$('#txtName').val('');
$('#selCompany').val('');
$('#selDept').val('');
$('#txtTitle').val('');
$('#txtMobilePhone').val('');
$('#txtOfficePhone').val('');
$('#txtOtherPhone').val('');
$('#dd').dialog('open');
}
function edit() {
var node = $('#tt').datagrid('getSelected');
if (node != null) {
$('#HdId').val(node.Id);
$.post('../ashx/SA01.ashx?type=edit&Id=' + node.Id, function (msg) {
var str = msg.split(',');
$('#selDept').html(str[8]);
$('#txtName').val(str[1]);
$('#selCompany').val(str[2]);
$('#selDept').val(str[3]);
$('#txtTitle').val(str[4]);
$('#txtMobilePhone').val(str[5]);
$('#txtOfficePhone').val(str[6]);
$('#txtOtherPhone').val(str[7]);
});
$('#dd').dialog('open');
type = 'save';
} else {
msgShow('系统提示', '请选择要编辑行', 'error');
}
}
//添加/保存信息
function saveCustom() {
var Name = $('#txtName').val();
var Company = $('#selCompany').val();
if (Name != '' && Company != '') {
var Id = $('#HdId').val();
var Dept = $('#selDept').val();
var Title = $('#txtTitle').val();
var MobilePhone = $('#txtMobilePhone').val();
var OfficePhone = $('#txtOfficePhone').val();
var OtherPhone = $('#txtOtherPhone').val();
var json_data = { Name: Name, Company: Company, Dept: Dept, Title: Title, MobilePhone: MobilePhone,
OfficePhone: OfficePhone, OtherPhone: OtherPhone };
$.post('../ashx/SA01.ashx?type=save&Id=' + Id,json_data, function (msg) {
if (msg) {
msgShow('系统提示', '编辑成功', 'info');
$('#tt').datagrid('reload');
} else {
msgShow('系统提示', '编辑失败，请稍后重试！', 'info');
}
});
} else {
msgShow('系统提示', '请输入名称和公司名', 'error');
}
}
function del() {
var node = $('#tt').datagrid('getSelected');
if (node != null) {
$.messager.confirm('系统提示', '删除后不可恢复，确定要删除？', function (i) {
if (i) {
$.post('../ashx/SA01.ashx?type=del&Id=' + node.Id, function (msg) {
if (msg) {
msgShow('系统提示', '删除成功', 'info');
$('#tt').datagrid('reload');
} else {
msgShow('系统提示', '删除失败，请稍后重试！', 'info');
}
});
}
})
} else {
msgShow('系统提示', '请选择要删除行', 'error');
}
}
//获取子节点的选项
function initCompany() {
$.post('../ashx/SA01.ashx?type=GetCompany', function (msg) {
$('#selCompany').html(msg);
});
}
function GetDept(box) {
$.post('../ashx/SA01.ashx?type=GetDept&Company=' + box.value, function (msg) {
$('#selDept').html(msg);
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="HdId" type="hidden" />
<table class="tooltab">
<tr><td> <div class="btabs">
</div>
</td>
<td style="text-align: right; padding-right: 15px"><input id="txt_search" menu="#search_menu" />
<div id="search_menu" style="width:120px">
<div name="Name">
Name</div>
<div name="Company">
Company</div>
</div>
</td>
</tr></table>
<div style="height:2px;"></div>
<div id="div1" style="width: 100%">
<table id="tt"></table>
</div>
<div id="dd" icon="icon-save" style="padding: 5px; width: 610px; height: 260px;">
<div id="divU" style=" height:180px">
<table cellpadding="0" cellspacing="1px" border="0" style="width: 100%;" bgcolor="b5d6e6">
<tr style="background-color: White; height: 32px;">
<td style="padding-left:5px">Name</td>
<td style=" padding:5px"><input id="txtName" type="text" class="txtClass"/></td>
<td style=" padding:5px">Company</td>
<td style=" padding:5px"><select id="selCompany" class="txtClass" οnchange="GetDept(this)">
</select></td>
</tr>
<tr style="background-color: White; height: 32px;">
<td style=" padding:5px">Dept</td>
<td style=" padding:5px"><select id="selDept" class="txtClass" >
</select></td>
<td style=" padding:5px">Title</td>
<td style=" padding:5px"><input id="txtTitle" type="text" class="txtClass" /></td>
</tr>
<tr style="background-color: White; height: 32px;">
<td style=" padding:5px">MobilePhone</td>
<td style=" padding:5px"><input id="txtMobilePhone" type="text" class="txtClass" /></td>
<td style=" padding:5px">OfficePhone</td>
<td style=" padding:5px"><input id="txtOfficePhone" type="text" class="txtClass" /></td>
</tr>
<tr style="background-color: White; height: 32px;">
<td style=" padding:5px">OtherPhone</td>
<td style=" padding:5px"><input id="txtOtherPhone" type="text" class="txtClass" /></td>
<td ></td>
<td></td>
</tr>
</table>
</div>
<div region="south" border="false" style="text-align: right; height: 30px; line-height: 30px;">
<a id="A3" class="easyui-linkbutton" οnclick="saveCustom()" icon="icon-ok" href="javascript:void(0)">
确定</a> <a id="A4" class="easyui-linkbutton" οnclick="closedd()" icon="icon-cancel" href="javascript:void(0)">
取消</a>
</div>
</div>
</form>
</body>
</html>
///布局
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="../JSCSS/jquery-easyui-1.2.4/themes/icon.css" rel="stylesheet" type="text/css" />
<link href="../JSCSS/jquery-easyui-1.2.4/themes/default/easyui.css" rel="stylesheet"
type="text/css" />
<script src="../JSCSS/jquery-easyui-1.2.4/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="../JSCSS/jquery-easyui-1.2.4/jquery.easyui.min.js" type="text/javascript"></script>
<script type="text/javascript">
function addTab(title, url) {
if ($('#TabsReport').tabs('exists', title)) {
$('#TabsReport').tabs('select', title);
} else {
var content = '<iframe scrolling="auto" frameborder="0" src="' + url + '" style="width:100%;height:100%;"></iframe>';
$('#TabsReport').tabs('add', {
title: title,
content: content,
closable: true
});
}
}
</script>
</head>
<body style="width:100%">
<div class="easyui-layout" fit="true" >
<div data-options="region:'west',split:true" title="请采验流程" style="width:150px;">
<ul>
<li><a href="#" οnclick="addTab('询采价对比查询','XunCaiJiaDuiBi.aspx')">询采价对比查询</a></li>
<li><a href="#" οnclick="addTab('单头','Report1.aspx')">单头</a></li>
<li><a href="#" οnclick="addTab('单身(已完成)','Report2.aspx')">单身(已完成)</a></li>
</ul>
</div>
<div id="Panle" region="center" style="background: '#eee'; overflow-y:'hidden'">
<div id="TabsReport" class="easyui-tabs" style="width:98%;" data-options="fit:true,border:false">
</div>
</div>
</div>
</body>
</html>
///datagrid在没有数据时显示相关提示内容
$('#dg').datagrid({
fitColumns:
true
,
url:
'product.json'
,
pagination:
true
,
pageSize: 3,
onLoadSuccess:
function
(data) {
if
(data.total == 0) {
//添加一个新数据行，第一列的值为你需要的提示信息，然后将其他列合并到第一列来，注意修改colspan参数为你columns配置的总列数
$(
this
).datagrid(
'appendRow'
, { itemid:
'<div style="text-align:center;color:red">没有相关记录！</div>'
}).datagrid(
'mergeCells'
, { index: 0, field:
'itemid'
, colspan: 4 })
//隐藏分页导航条，这个需要熟悉datagrid的html结构，直接用jquery操作DOM对象，easyui datagrid没有提供相关方法隐藏导航条
$(
this
).closest(
'div.datagrid-wrap'
).find(
'div.datagrid-pager'
).hide();
}
//如果通过调用reload方法重新加载数据有数据时显示出分页导航容器
else
$(
this
).closest(
'div.datagrid-wrap'
).find(
'div.datagrid-pager'
).show();
},
title:
'easyui datagrid没有数据显示无数据提示信息'
,
width: 550,
columns: [[{ field:
'itemid'
, width: 80, title:
'Item ID'
},
{ field:
'productname'
, width: 100, editor:
'text'
, title:
'Product Name'
},
{ field:
'listprice'
, width: 80, align:
'right'
, title:
'List Pirce'
},
{ field:
'unitcost'
, width: 80, align:
'right'
, title:
'Unit Cost'
}]]
});
});
110
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
