编辑页面弹出：top.showWin(url,options)

1.family.jsp

点击按钮弹出编辑页面

 

按钮：<a href="javascript:update('joke');">update</a>

JavaScript：

function update(name){

 var url=parent.formateUrl("family/edit.html")+"?name="+name;

var options={

w：340，

h：400，

title:"操作"，

fn："submitForm",

id:"return_update"

};

top.showWin(url,options);

}

2.Controller

返回页面，返回参数

 

@RequestMapping("family")

@ReqluestMapping("/edit.html")

public String toUpdate(ModelMap model,HttpServletReqluest request){

... 

model.addAttribute("family",(Family) Object);

return "family_edit";

}

3.family_edit.jsp

返回的页面， <form>和 <table>的使用，： 此form无提交键

EasyUI中的combox的使用，加载select数据，

使用 JQuery显示返回的Model数据，： $("#id")获取控件，"${Object.name}"表示参数内容

提交form的函数和数据验证： jQuery控件数据获取：$("#id").val()，$("#id").combox("getValue")

 

HTML：

<form id="add_form" method="post">

 <table>

 <tr>

  <td style="width:60px;text-align:right;">name</td>

 <td style="width:150px;"><input type="text" id="name" style="line-height:25px;"

       name="name" value="${Object.name}" /></td>

 </tr>

 

<tr>

  <td style="width:60px;text-align:right;">select</td>

 <td style="width:150px;">

  <select id="boun" class="easyui-combox" name="boun"

 data-options="height:21,panelHeight:120,width:140" editable=false>

   <option value="1">peiou</option>

 

 <option value="1">zinv</option>

 </td>

 </tr>

</table>

</form>

JavaScript：

$（function(){

 $("#boun").combox("setValue","${Object.boun}");

}）;

function submitForm(){

 if($("#name").val()==""||$("#boun").combox("getValue")==""){alert("null");return;}

$("#add_form").ajaxSubmit({

 url:top.formatUrl("family/save.json"),

type:"post",

dataType:"json",

 success:function(data){alert("ok");top.refresh('doRefrest');top.closeWin("return_update");},

error:function(){alert("error");}

 

})

}