您的位置：首页 > 产品设计 > UI/UE

S2SH 学习笔记之easyui——表单传递类对象

2016-04-28 13:46 441 查看
在学习S2SH框架，jsp表单处理时，传递参数如String,int常见的参数基本没有问题，但在传递一个类(Model)时，遇到一点点小挫折。

通常表单传参数步骤如下：

服务器(Action类)

1.定义变量

2.创建getter和setter，便于前端传值

Scope("prototype")
@Namespace("/Control")
@Action(value="AlarmGroup_SMS")
public class RTDAlarmGroup_SMSAction  extends BaseAction  {
private String s_UserID;
private String s_delUserIDs;
private RTDAlarmGroup_SMS_User User;

public String getUserID() {
return s_UserID;
}

public void setUserID(String s_UserID) {
this.s_UserID = s_UserID;
}

public String getDelUserIDs() {
return s_delUserIDs;
}

public void setDelUserIDs(String s_delUserIDs) {
this.s_delUserIDs = s_delUserIDs;
}

public RTDAlarmGroup_SMS_User getUser() {
return User;
}

public void setUser(RTDAlarmGroup_SMS_User User) {
this.User = User;
}

// 其他代码


前台(jsp)

<body style="margin: 5px;">
<div class="easyui-layout" data-options="fit:true,border:false,title:'短信用户'" >
<div data-options="region:'north',split:true,title:'<%=s_Title%>',collapsible:false" style="height:20px;">
</div>
<div data-options="region:'west',split:true,title:'短信用户',collapsible:false" style="width:50%;">
<table id="dgUser"></table>
</div>

<div data-options="region:'east',split:true,title:'短信报警点',collapsible:false" style="width:50%;">
<table id="dgAlmTag" data-options="fit:true,border:false"></table>
</div>
</div>
<!-- 属性对话框 User-->
<div id="dlgUser" class="easyui-dialog" style="width: 350px;height: 250px;padding: 10px 20px"
closed="true" buttons="#dlg-buttons">
<form id="fm" method="post">
<table cellspacing="5px;">
<tr style="display:none;">
<td>ID：</td>
<td><input class="easyui-validatebox" type="text" name="User.id" id="ID"   disabled="true" /></td>
</tr>
<tr>
<td>姓  名：</td>
<td><input class="easyui-validatebox" type="text" name="User.Name" id="Name"  required="true" style="width:150px;"/></td>
</tr>
<tr>
<td>手  机：</td>
<td><input class="easyui-validatebox" type="number" validType="length[11,11]" name="User.Phone" id="Phone"  required="true" style="width:150px;"/></td>
</tr>
<tr style="display:none;">
<td>短信通知：：</td>
<td><input class="easyui-validatebox" type="text"  name="User.Checked" id="Checked"   style="width:150px;"/></td>
</tr>
<tr>
<td>短信通知：</td>
<td style="text-align:left">
<span class="radioSpan">
<input type="radio" name="UserChecked" id="UserChecked0"  value="false">否   </input>
<input type="radio" name="UserChecked" id="UserChecked1"  value="true">是   </input>
</span>
</td>
</tr>
</table>
</form>
</div>

<div id="dlg-buttons">
<a href="javascript:save()" class="easyui-linkbutton" iconCls="icon-ok"> 保 存</a>
<a href="javascript:close()" class="easyui-linkbutton" iconCls="icon-cancel"> 关 闭</a>
</div>

</body>


javascript部分

<span style="font-family: Arial, Helvetica, sans-serif;">	function addUser(){</span>


resetValue();

$(dlgUser).dialog("open").dialog("setTitle","新增 - 短信用户信息");

url = "${contextPath}/Control/AlarmGroup_SMS!addUser?ID_AlarmGroup=<%=ID_AlarmGroup%>";
}

function editUser(){
var selectedRows=$(dgUser).datagrid('getSelections');
if(selectedRows.length!=1){
$.messager.alert("系统提示","请选择一条要编辑的数据！");
return;
}

var row = selectedRows[0];
$(dlgUser).dialog("open").dialog("setTitle","编辑 - 短信用户信息");

$("#ID").val(row.id);
$("#Name").val(row.Name);
$("#Phone").val(row.Phone);
$("#Checked").val(row.Checked);
//$("#Checked1").combobox("setValue",row.Checked);

if (row.Checked == true)
document.getElementById("UserChecked1").checked=true;
else
document.getElementById("UserChecked0").checked=true;

url="${contextPath}/Control/AlarmGroup_SMS!editUser?ID_AlarmGroup=<%=ID_AlarmGroup%>&UserID=" + row.id;
}

function delUser(){
var selectedRows=$(dgUser).datagrid('getSelections');
if(selectedRows.length == 0){
$.messager.alert("系统提示","请选择要删除的数据！");
return;
}

var s_Ids = [];
for(var i = 0; i < selectedRows.length; i++){
s_Ids.push("'" + selectedRows[i].id + "'");
}
var ids = s_Ids.join(",");
$.messager.confirm("系统提示","您确认要删掉这<font color=red>"+selectedRows.length+"</font>条数据吗？",function(r){
if(r){
$.post("${contextPath}/Control/AlarmGroup_SMS!deleteUser",{ID_AlarmGroup:<%=ID_AlarmGroup%>,DelUserIDs:ids},function(result){
if(result.success){
//$.messager.alert("系统提示","您已成功删除数据！");
$(dgUser).datagrid("reload");
}else{
$.messager.alert('系统提示',result.errorMsg);
}
},"json").error(function() {
alert("执行失败");
})
;
}
});
}

function save(){
$("#fm").form("submit",{
url:url,
onSubmit:function(){
if($("#Name").val()==""){
$.messager.alert("系统提示","名称不能为空");
return false;
}
if($("#Phone").val()==""){
$.messager.alert("系统提示","手机不能为空");
return false;
}
//
$("#Checked").val($('input[name="UserChecked"]:checked').val());
//$.messager.alert("系统提示Checked",$("#Checked").val());
return $(this).form("validate");
},
success:function(data){
var result = eval('(' + data + ')');
if(result.errorMsg){
$.messager.alert("系统提示",result.errorMsg);
return;
}else{
//$.messager.alert("系统提示","保存成功");
resetValue();
$(dlgUser).dialog("close");
$(dgUser).datagrid("reload");
}
}
});
}

function resetValue(){
$("#ID").val("");
$("#Name").val("");
$("#Phone").val("");
//		$("#Checked").combobox("setValue","1");

//$.messager.alert("系统提示:UserChecked",$('input[name="UserChecked"]:checked').val());
//var str = document.getElementsByName("UserChecked");
document.getElementById("UserChecked1").checked = true;
}

function close(){
$(dlgUser).dialog("close");
resetValue();
}


但始终得到的User是一个null,无法正确地从前台获取到值，s_UserID就能够正常从前台获取值，经过不断测试（因初学，对Action机制了解不深），发现是User没有初始化的原因，导致前端无法传值，于是修改如下：

// SMS_User 必须初始化，否则easyui 表单无法向User传值
private RTDAlarmGroup_SMS_User User = new RTDAlarmGroup_SMS_User();
这样，就能很顺利从前台得到对应的值了。

很奇怪：为啥int、String就不用初始化就可以呢，而自己的类就必须要先初始化呢。

另外，特记：前台传递参数的名字调用Action类的get对应的名字，和Action定义的变量名不一定完全一致。

例如：

变量名为s_UserID;但对应的get是GetUserID()，

private String s_UserID;
public String getUserID() {
return s_UserID;
}

public void setUserID(String s_UserID) {
this.s_UserID = s_UserID;
}


则表单对应调用的应该是UserID,而不是s_UserID;

url="${contextPath}/Control/AlarmGroup_SMS!editUser?ID_AlarmGroup=<%=ID_AlarmGroup%>&UserID=" + row.id;


前端效果：

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