您的位置:首页 > 数据库

Extjs2.0+gridPanel+checkbox读取从数据库中写入到xml文件的字段

2011-10-16 14:56 381 查看
<style type="text/css">
.x-grid-record-red table{
background-color: #E6F2FF;
}
</style>
<script type="text/javascript" language="javascript">
//加载事件
Ext.onReady(function() { });
//选择已有合同
function ChangeContract() {
var MyRecord = Ext.data.Record.create([
{ name: 'ContractType' },//xml文件里面的节点
{ name: 'PayMoneyNotId' },
{ name: 'ContractName' },
{ name: 'ContractNo' },
{ name: 'PayMoney' },
{ name: 'ContractStartT' },
{ name: 'ContractEndT' },
{ name: 'ContractRemarks' },
{ name:'ContractNumber'}
]);
var myReader = new Ext.data.XmlReader({//读取的xml文件
totalRecords: "results", //总records
record: "ContractInfo", //xml文件的ContractInfo节点
id: 'ContractId'       //xml文件的ContractId节点
}, MyRecord);
var myProxy = new Ext.data.HttpProxy({
url: '/WebTest/DocumentManage/Contract.xml', //xml文件
success: function() {
//Ext.Msg.alert("提示", "成功了");
},
failure: function() {
Ext.Msg.alert("提示", "下载数据失败"); //失败提示
}
});
//这里类似读取json数据方式
var mystore = new Ext.data.Store({
proxy: myProxy,
reader: myReader
});
var checkbox = new Ext.grid.CheckboxSelectionModel({ singleSelect: false }); //初始化一个checkbox

var colM = new Ext.grid.ColumnModel([
checkbox,
{ header: "合同类型",hidden:true, width: 60, dataIndex: "ContractType" }, //sortable排序
{ header: "放款编码", width: 120, dataIndex: "PayMoneyNotId", sortable: true },
{ header: "合同名称", width: 95, dataIndex: "ContractName" },
{ header: "合同编号", width: 100, dataIndex: "ContractNo", sortable: true },
{ header: "放款金额(万元)", width: 90, dataIndex: "PayMoney" },
{ header: "起止日期", width: 100, dataIndex: "ContractStartT" },
{ header: "截止日期", width: 100, dataIndex: "ContractEndT" },
{ header: "备注", width: 100, dataIndex: "ContractRemarks" },
{ header: "合同编号", width: 100, dataIndex: "ContractNumber" }
]);
var grid = new Ext.grid.GridPanel({
height: 330,
id: "GpContract",
width: 770,
cm: colM,   //显示各个列
store: mystore, //数据源来自mystore
autoExpandColumn: 2,
viewConfig: {
forceFit: true,
getRowClass: function(record, rowIndex, rowParams, store) {
//禁用数据显示红色
if ((rowIndex + 1) % 2 != 0) {//设置gridPanel奇数行的颜色
return 'x-grid-record-red';
} else {
return '';
}
}
}
});
mystore.load(); //加载
var win = new Ext.Window({
id: "winContractInfo",
title: "显示已有合同信息",
height: 400,
width: 780,
// modal: true,
buttonAlign: "center",
resizable: true,
frame: true,
items: [grid],
html:"<p></p>",
buttons: [
{
xtype: "button", text: "确定", handler: function() {
alert("你点击了确定按钮");
var sm = grid.getSelectionModel();
var store = grid.getStore();
var view = grid.getView();
//下面是操作gridview循环的checkbox
for (var i = 0; i < view.getRows().length; i++) {
if (sm.isSelected(i)) {
var record = store.getAt(i); //获取gridPanel的行数
var ck_GetPayMoneyNotId = document.getElementsByName("AllSelect");
for (var j = 0; j < ck_GetPayMoneyNotId.length; j++) {
if (ck_GetPayMoneyNotId[j].checked == true) {
var ck_PayMoneyNotId = ck_GetPayMoneyNotId[j].id.substring(2, ck_GetPayMoneyNotId[j].id.length); //获取到当前的放款编码
}
}
alert("checkbox:" + ck_PayMoneyNotId);
alert("gridPanel:" + record.get('PayMoneyNotId'));
//为界面的控件赋值
document.getElementById("txtContractName").options[document.getElementById("txtContractName").selectedIndex].text = record.get('ContractName');
document.getElementById("txtContractName").options[document.getElementById("txtContractName").selectedIndex].value = record.get('ContractNumber');
document.getElementById("txtContractNo").value = record.get('ContractNo');
document.getElementById("txtContractStartT").value = record.get("ContractStartT");
document.getElementById("txtContractEndT").value = record.get("ContractEndT");
document.getElementById("txtContractRemarks").value = record.get("ContractRemarks");
}
}

Ext.getCmp("winContractInfo").close();
}
},
{
xtype: "button", text: "关闭", handler: function() {
Ext.getCmp("winContractInfo").close();
}
}
]
});
win.show();  //显示窗体

//为gridPanel里面的checkbox增加rowselect选择事件
//   grid.getSelectionModel().on('rowselect', function(sm, rowIdx, r) {
//       alert('勾选了checkbox后,获得选中行的ContractNo这列的值是:' + grid.store.getAt(rowIdx).get('ContractNo'));
//       document.getElementById("txtContractName").options[document.getElementById("txtContractName").selectedIndex].text = grid.store.getAt(rowIdx).get('ContractName');
//       document.getElementById("txtContractName").options[document.getElementById("txtContractName").selectedIndex].value = grid.store.getAt(rowIdx).get('ContractNumber');
//       document.getElementById("txtContractNo").value = grid.store.getAt(rowIdx).get('ContractNo');
//       document.getElementById("txtContractStartT").value = grid.store.getAt(rowIdx).get("ContractStartT");
//       document.getElementById("txtContractEndT").value = grid.store.getAt(rowIdx).get("ContractEndT");
//       document.getElementById("txtContractRemarks").value = grid.store.getAt(rowIdx).get("ContractRemarks");
//   });
}
//下拉列表是否选择新增
function IsSelectAdd() {
if (document.getElementById("IsAdd").options[document.getElementById("IsAdd").selectedIndex].value == 1) {
document.getElementById("txtContractName").disabled = true; //合同名称
document.getElementById("txtContractNo").disabled = true;   //合同编号
document.getElementById("txtContractStartT").disabled = true; //起始日期
document.getElementById("txtContractEndT").disabled = true;  //截止日期
document.getElementById("btnAutoContractNo").disabled = true; //自动编号
document.getElementById("A1").disabled = false;  //选择已有这个标签不屏蔽
} else {
document.getElementById("A1").disabled = true;
document.getElementById("txtContractName").disabled = false;
document.getElementById("txtContractNo").disabled = false;
document.getElementById("txtContractStartT").disabled = false;
document.getElementById("txtContractEndT").disabled = false;
document.getElementById("btnAutoContractNo").disabled = false; //如果选择新增的时候选择已有这个标签屏蔽
}
}
</script>


//HTML

<table style="width: 100%" id="ContractTab" runat="server">
<td>
<asp:GridView ID="gvLetterManageInfo" runat="server" AutoGenerateColumns="False" Width="100%"
SkinID="GridView" CssClass="commontable" GridLines="None" DataKeyNames="LmId">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<input type="checkbox" id='cb<%# Eval("LetterNo") %>' value='<%# Eval("LmID") %>'
name="AllSelect" onclick="SelectOne(this);" />
</ItemTemplate>
<HeaderStyle Width="5%" />
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
<tr>
<td colspan="3">
<div class="group">
子合同信息</div>
</td>
<td align ="center" ><font color='blue'>(编号规则:总合同编号-二位流水号【总合同-01】)</font></td>
</tr>
<tr>
<td class="textposition" style="width: 20%;">
总合同:
</td>
<td style="width: 30%;">
<asp:DropDownList ID="txtParentContractNo" runat="server" Width="90%" onchange="GetContractNo();">
</asp:DropDownList>
<font color="red">*</font>
</td>
<td  colspan ="2" align="left" >
<font color="red">注:无总合同编号者,请选择“【无】”!</font>
</td>
<%--<td style="width: 10%;">
</td>--%>
</tr>

<tr>
<td class="textposition" style="width:20%;">
是否新增:
</td>
<td style="width:30%;" align="left">
<%--<asp:DropDownList ID="IsAdd" runat="server" Width="90%"  onchange=" return IsSelectAdd();">
<asp:ListItem Value="0">11</asp:ListItem>
<asp:ListItem Value="1">22</asp:ListItem>
</asp:DropDownList>--%>
<select id="IsAdd" style="width:90%;" onchange="return IsSelectAdd()">
<option value="0">新增</option>
<option value="1">选择已有</option>
</select>
<font color="red">*</font>
</td>
<td style="width:20%;">
<a id="A1"   href="#" onclick="ChangeContract()"  style="color: Blue;"> 选择已有</a>
</td>
</tr>
<tr>
<td class="textposition" style="width: 20%;">
合同名称:

</td>
<td style="width: 30%;">
<asp:DropDownList ID="txtContractName" runat="server" Width="90%">
</asp:DropDownList>
<font color="red">*</font>
</td>
<td class="textposition" style="width: 20%;">
合同编号:      </td>
<td align="left" style="width: 30%">
<asp:TextBox ID="txtContractNo" runat="server" ReadOnly="false"
CssClass="textbox" Width="45%"></asp:TextBox><font color="red">*</font>
<a id="btnAutoContractNo" runat="server" href="javascript:void(0)" onclick="GetContractNo()" style="color: Blue;">
自动编号</a>
</td>
</tr>
<tr>
<td class="textposition">
合同起始时间:      </td>
<td>
<jyk:MyTextBox ID="txtContractStartT"  runat="server" Width="45%" InputType="Date"
MaxTextBox="txtContractEndT" />
</td>
<td class="textposition">
合同截止时间:      </td>
<td>
<jyk:MyTextBox ID="txtContractEndT" runat="server" Width="45%" InputType="Date" MinTextBox="txtContractStartT" />
</td>
</tr>
<tr>
<td class="multirow">
备注:      </td>
<td colspan="3">
<asp:TextBox ID="txtContractRemarks" runat="server" CssClass="textbox" Height="50px"
TextMode="MultiLine" Width="96%"></asp:TextBox>
</td>
</tr>
</table>


   
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐