- 注册时间
- 2012-11-4
- 最后登录
- 2013-12-13
- 阅读权限
- 10
- 积分
- 101
- 精华
- 0
- 帖子
- 19
|
factory 发表于 2012-11-5 17:24 
1.你可以监听表格的onrowclick事件,判断如果满足条件,就取消选中.
比如第二条数据不给选中2.建议你把出问题 ...
1,textboxlist.html 文件内容
<!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>
<title>TextBoxList</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link href="../demo.css" rel="stylesheet" type="text/css" />
<script src="../../scripts/boot.js" type="text/javascript"></script>
</head>
<body>
<input id="tbl1" class="mini-textboxlist" name="tbl"
textName="tblName" required="true" style="width: 250px;" readonly="true"
url="../data/AjaxService.jsp?method=FilterCountrys" value=""
text="" valueField="id" textField="text" />
<br />
<br />
<input type="button" value="设置返回" />
<script type="text/javascript">
mini.parse();
function add() {
var btnEdit = mini.get("tbl1");
mini.open({
url: bootPATH + "../demo/datagrid/grouping.html",
// url: bootPATH + "../demo/datagrid/group.jsp?tt=3333",
title: "新增员工", width: 600, height: 360,
onload: function () {
var textvalue = btnEdit.value;
var iframe = this.getIFrameEl();
var data = { action: "new",id:textvalue};
iframe.contentWindow.SetData(data);
},
ondestroy: function (action) {
if (action == "ok") {
var iframe = this.getIFrameEl();
var checkcode = mini.get("tbl1").value;
var data = iframe.contentWindow.GetData();
if(data!=null || data!=""){
data = mini.clone(data);
var btnEditValue = btnEdit.value;
var btnEditText = btnEdit.text;
if(btnEditValue==null||btnEditValue==""){
btnEdit.setValue(data.id);
}else{
btnEdit.setValue(data.id+","+btnEditValue);
}
if(btnEditText==null||btnEditText==""){
btnEdit.setText(data.text);
}else{
btnEdit.setText(data.text+","+btnEditText);
}
}
}
}
});
}
// mini.parse();
// var t = mini.get("tbl1");
// t.on("valuechanged", onValueChanged);
function onValueChanged(e) {
alert(this.getValue() + "\n" + this.getText());
}
</script>
</body>
</html>
grouping 页面
<!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>
<title>Grouping 分组表格</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="../demo.css" rel="stylesheet" type="text/css" />
<script src="../../scripts/boot.js" type="text/javascript"></script>
</head>
<body >
<form id="form1" method="post">
<h1>Grouping 分组表格</h1>
<div class="mini-toolbar" style="text-align:center;padding-top:8px;padding-bottom:8px;" borderStyle="border:0;">
<a class="mini-button" style="width:60px;">确定</a>
<span style="display:inline-block;width:25px;"></span>
<a class="mini-button" style="width:60px;">取消</a>
</div>
<div style="padding-bottom:5px;">
<span>员工姓名：</span><input type="text" id="key" />
<input type="button" value="查找"/>
<input type="hidden" name="A1" id="A1" >
</div>
<div id="datagrid1" class="mini-datagrid" style="width:700px;height:280px;"
url="../../demo/data/AjaxService.jsp?method=SearchEmployees&name=6666666" idField="id" allowResize="true"
showFooter="false" pageSize="20" pager="#pager1"
multiSelect="true"
>
<div property="columns">
<div type="checkcolumn" field="id" readonle="true"></div>
<div field="loginname" width="120" headerAlign="center" allowSort="true">员工帐号</div>
<div field="name" width="120" headerAlign="center" allowSort="true">姓名</div>
<div field="gender" width="100" renderer="onGenderRenderer" align="center" headerAlign="center">性别</div>
<div field="salary" width="100" allowSort="true">薪资</div>
<div field="dept_name" width="100" allowSort="true" renderer="onDeptName" >部门</div>
<div field="age" width="100" allowSort="true">年龄</div>
<div field="createtime" width="100" headerAlign="center" dateFormat="yyyy-MM-dd" allowSort="true">创建日期</div>
</div>
</div>
<script type="text/javascript">
mini.parse();
var myDate1 = new Date();
// 用户获取父页面 传递过来的参数的值；
function SetData(data) {
grid.load();
// 将此值放在隐藏文本域中，方便别的function 的方法调用。
$("#A1").val(data.id);
}
var grid = mini.get("datagrid1");
grid.groupBy("dept_name", "asc");
grid.setCollapseGroupOnLoad(true);
function onDrawGroup(e) {
e.cellHtml= e.value;
var myDate2 = new Date();
// runtime 用户获取从开始执行到执行到此处的时间，让其指定时间后执行。
var runtime = myDate2-myDate1;
setTimeout('aaa()', runtime )
}
//指定时间后执行的方法，避免执行顺序的影响
<!-- 同时，跟查询出来的结果进行匹配，如果从父页面传送过来的值包含行 的 id，那就就让此行消失掉，避免了重复选择的情况-->
function aaa(){
var vv = document.getElementById("A1").value;
var rows = grid.getData();
for (var i = 0, l = rows.length; i < l; i++) {
var row = rows;
if(vv.indexOf(row.id)>-1){
//问题是： 上面的判断如果包含这个row.id， 就让对应行的那个checkbox成为不可选状态或者让它隐藏。 最好两种方式都告诉哈，客户的需求随时在变的，你懂的，谢谢啦。。。。
grid.removeRow(row); // 这个怎么改？
}
}
}
//对"createtime"字段，进行降级排序
grid.sortBy("createtime", "desc");
function search() {
var key = document.getElementById("key").value;
myDate1 = new Date();
grid.load({ key: key });
}
$("#key").bind("keydown", function (e) {
if (e.keyCode == 13) {
search();
}
});
<!--下面的代码 点击确定后将值返回过去-->
function GetSelecteds() {
var rows = grid.getSelecteds();
return rows;
}
function GetData() {
var rows = grid.getSelecteds();
var ids = [], texts = [];
for (var i = 0, l = rows.length; i < l; i++) {
var row = rows;
ids.push(row.id);
texts.push(row.name);
}
var data = {};
data.id = ids.join(",");
data.text = texts.join(",");
alert(data.id);
return data;
}
function CloseWindow(action) {
if (window.CloseOwnerWindow)
return window.CloseOwnerWindow(action);
else
window.close();
}
function onOk() {
// 获取被选中的行数，如果为0，就不进行后面的操作；
var rows = grid.getSelecteds();
if(rows.length==0){
return;
}else{
CloseWindow("ok");
}}
function onCancel() {
CloseWindow("cancel");
}
<!--上面的代码 实现了点击确定， 取消后执行的操作 -->
</script>
</form>
</body>
</html>
|
|
发表于 2012-11-5 15:52:54
收藏
发表于 2012-11-5 17:24:07
