如何做一个页面弹窗，然后输入明细数据，保存后数据更新到主页面？

弹出窗口可分为打开一个新的浏览器窗口和在本页面上打开一个弹出层，打开新的浏览器窗口现在一般用的比较少，交互性和用户体验相对较差。这里我重点说一下弹出层方式：
弹出层设置一般有两种方式：
1、是自己写隐藏div,在需要打开弹出层的时候可以显示div；完成后可以隐藏div ;
2、使用现有的一些控件，比如easyui的dialog组建、artDialog组件等，现在类似的组建比较多也使用起来也相对比较方便；

在弹出窗口中做明细数据的录入、保存和更新到主页面实现思路大概如下：
1、在主页面点击按钮打开弹出层，弹出层中有录入明细信息的表单
2、在明细表单中录入信息后，点击表单中的按钮，将信息发送到服务器端，由服务器端进行入库（表单的提交可以是form提交和ajax方式提交 ）
3、form表单提交可以设置target="_self"，提交成功后刷新本页面，主页面会查询出新增的明细数据
4、ajax方式提交，当数据提交成功（即获得服务返回成功标识 ）后，可以将新增的明细数据通过js动态添加到主页面上，然后关闭弹出层，这种方式的用户体验要好很多。

可以使用js 的弹出模式窗口。
window.showModalDialog(URL, null,
"dialogWidth:330px;dialogHeight:auto;status:no;help:no;resizable:yes;");

这个方法，弹出，
你可以百度一下 ，js弹出模式窗口
如果你不喜欢这样的窗口
你也可以在这个页面写一个浮动的div框，这个框默认隐藏，然后点击的时候执行js，js方法里面控制这个浮动的div框显示，
这样就实现了。