Question

用得是Spring+Hibernate+Jquery，初学想实现一个简单的增删改查。目前的问题是修改怎么用弹出窗口实现。

我的意思是，在弹出一个窗口的同时要有对应的值能够显示，然后在其基础上进行修改，然后提交后，弹出窗口关闭。
产品只有四个字段（ID,NAME,SIZE,DESC）

这个是我做增加时用的弹出代码：
function openUpload()
{
$("#uploadDiv").show()
.dialog(
{
modal: true,
resizable: false,
width: 428,
height: 250,
overlay: {opacity: 0.5 , background: "black"}
});}

这个是html页面的代码：
<div id="uploadDiv" style="display:none">
<form action="proUpload" method="post">
<table width="400" border="0" cellspacing="1" cellpadding="10">
<caption>增加产品</caption>
<tr>
<td height="25">产品名称</td>
<td><input id="pname" name="pname" type="text" /></td>
</tr>
<tr>
<td height="25">产品尺寸</td>
<td><input id="psize" name="psize" type="text" /></td>
</tr>
<tr>
<td height="25">产品描述</td>
<td><input id="pdesc" name="pdesc" type="text" /></td>
</tr>
<tr>
<td colspan="3" align="center">
<input type="submit" value="增加" />
<input type="reset" value="重设" />
</td>
</tr>
</table>
</form>
</div>

各位大侠能指点一下么？非常感谢

Answer 1

你所说的跟spring和hibernate也没有什么关系啊，就是前台页面的设计嘛。你肯定有一个产品列表已经列出在页面了。你想做的是：（1）当用户点击产品列表中的某一产品时，弹出的对话框，就会把点击的那一个产品的信息罗列到对话框中；（2）修改对话框中相应的值，点击对话框中的确认。后台改值，并为前台做出相应的响应。

第（1）步好说，不就是在点击事件中做一些赋值操作嘛，当然，记得把id带着。纯jQuery/javascript代码完成。
第（2）步的话，看你是需要用到ajax与否。如果不用，就多些后台的转发或重定向，即 点击对话框中“确认”将form表单提交，有servlet响应改变数据库的值，并跳转到同一页面。 如果用ajax, 就将改变好的值做成json或是你认为方便的值，通过放到response.getOutputstream() （有mvc框架要依框架的方式）中响应回页面，在页面中的回调函数里在做一些赋值 操作，就是把reponse中的新值 更新到刚才点击的那个产品一项中

追问

呵呵，你说的需求完全就是我现在的情况，目前的问题是就是你说的第一步，用纯Jquery代码这个我就是不会写。。。。，反而是第二步我很好理解。
请问你第一步的相关的示例代码吗？或者给我一个网址，我学习一下，我都没有找到。。。。
非常感谢啦兄弟

追答

       OK, 我给你写好一个，你试试效果，把以下HTML代码粘贴到记事本中，保存为html格式文件，用浏览器打开，然后试着点每一行。需要能访问外网的环境，因为我引用了网络上的jquery库。至于学习嘛，没有多点儿东西，我也不知道什么好的网站。主要就是多用浏览器里的控制台调试就好了。

     好吧，没有足够的地方贴文字。

Answer 2

用ajax 弹框 传id过去后台生成一段html表单 在js输出 点击修改后再ajax后台修改反馈结果到弹框 这样就不必刷新当前页面了

追问

额，能具体一点么，最好有点代码，因为是初学，所以只能按图索骥了，谢谢啊

Answer 3

jquery ui中有dialog, 是jquery写好的弹出式dialog组件, 你可以拿来用
jquery.js中并没有这个, 你要引入jquery-ui的js才行

Answer 4

超级简单、$.ajax({
async : false,
cache:false,
type: 'POST',...............
dataType : "json",
url: root+'/hall/edihall.action?id='+idA,//请求的action路径
error: function (data) {//请求失败处理函数
$.messager.alert('初始化失败','获取数据失败','error');
},success:function(data){

追问

对我来说有点难啊兄弟，能帮忙解释下么，非常感谢