弹出模态窗口总结

admin

2010年8月13日 8:59 本文热度 4219

今天在做一个弹出模态窗口时搞了我一晚上。google半天，找来找去文章就哪么几篇，别人的能刷新偶的就是不行，后来在一网友帮助下总算是找到问题所在，搞定了。

//在模态窗口中提交数据总是会弹出一个新窗口，上次遇到过这问题，所以这次一来就在html里加上了
    <form id="form1" runat="server" target="bbc2188">
     <iframe name="bbc2188"   width="0px"   height="0px"   frameborder="0"    style="display:none"></iframe>
//然后在网上又看到这样一段，    <base target="_self">，偶就把这段加到head里面去了，因为没太注意这个target="_self"所以搞得偶一晚上都在找问题。

就这样自己试了很多常用js刷新页面的方法，都不能实现这个模态页面刷新，又搜索了半天，看到有人这样重新加载要刷新的页面

在html里放一个a标签，让他不显示。

下面是用到的js脚本

    function setreloadhref()//刷新网页
   {
        var reload=document.getelementbyid ("reload");
        reload.href ="default.aspx?pid="+geturl()+"&"+math.random();
    }
    function reloadclick()//单击触发刷新事件
    {
        var reload=document.getelementbyid ("reload");
        reload.click();
    }
    </script>
然后在<body>中添加事件处理方法

现在页面可以刷新了，但怎么总不是最新的呢？也就是说现在提交一条数据页面刷新还是没变，只有在按一次f5这个模态窗口才刷新刚才提交的数据，删除也一样，后来发现把<form id="form1" runat="server" target="bbc2188">中的target属性去掉就搞定了。一提交就完成刷新了。

并且之前添加的哪些木用的js脚本也可以删除了，又是一个小错误搞偶一晚上，哎。
====================

asp中的模态对话框

终于开始写b/s的程序。
今天遇到了一个问题, 如何处理模态对话框。具体的要求是：在选择页面上的“添加”按钮，弹出模态对话框，在对话框中添加记录后，选择“确定”按钮，关闭对话框，更新主页面表格的数据。

网上关于模态对话框的讨论有很多，试了一天，发现一个比较好的解决方法：

1、显示对话框：
在javascript脚本文件中加入：
    function openeditwin(frmwin,width,height)
   {
    var me;
    // 把父页面窗口对象当作参数传递到对话框中，以便对话框操纵父页自动刷新。
    me = window;
    // 显示对话框。
    window.showmodaldialog(frmwin,me,'dialogwidth='+width +'px;dialogheight='+height+'px;help:no;status:no')
   }
  在c#中调用：
cmdadd.attributes.add("onclick","javascript:openeditwin('" + session["showform"] + "',540,400)");
很多方法是用 response.write或者registerstartupscript 来实现，但是都存在问题，如显示对话框时页面是空白、刷新页面的时候弹出对话框等。
在对话框中加入jscript脚本
   function1 onsubmit() // 强制本窗口提交
   {
    document.form1.target="_self";
   }
2、关闭对话框
   response.write("<script language='javascript'>");
    response.write("window.close()");
   response.write("</script>");
3、对话框关闭后，执行更新操作
   在对话框的关闭事件中加入：
response.write("<script language='javascript'>");
    response.write("window.close()");
    response.write("</script>");
4、更新主页面中的表格数据。
在“添加”按钮的处理方法中，添加表格更新的代码。

asp.net使用弹出窗口（对话框）的体会

       从整理这篇文章的目的，在于记录前一段使用弹出窗口的经验，同时结合对一些资料的阅读，总结弹出窗口使用方法。
        首先描述一下需求：在信息发布系统中，信息的一个字段信息为“栏目”，需要从多级栏目中选择出一个栏目发布文章。考虑到用户界面的美观和操作的方便，决定在新信息发布页面中放置一个button，用户点击该button后，弹出一个显示栏目树的窗口，用户可在该窗口中选择栏目。
        这样就引出了本文要讨论的问题：如何弹出窗口?如何在父窗口和弹出窗口之间传递信息？
在回答这两个问题之前，首先需要指出，目前有三种方法可以弹出窗口（对话框），它们分别是：

window.open方法
无模式对话框
有模式对话框

如何在这三种方法中做出选择、如何对后两种方法做出前面两个问题的回答，这在文后所附的文章中都有介绍。所以，这里主要针对window.open方法做出回答。
下面是一个使用window.open弹出窗口的简单的例子：

function open_cate()

{

window.open("openup.aspx","","toolbar=0,location=0,directories=0,status=0,
menubar=0,scrollbars=1,resizable=0,left=200,top=100,width=250,height=400");

}

</script>

从代码中可以看出，我们可以对弹出窗口的诸多属性进行设置。如果我们想要在点击一个button时弹出窗口，值需要在该button的onclick时间中调用该javascript函数即可。

解决了如何弹出窗口的问题之后，下面讨论如何在页面之间传递信息。

父窗口向弹出窗口传递信息

这里我采用的办法是在url中拼接参数传递信息。window.open的第一个参数为url，我们可以把参数加在url后，例如 'openup.aspx?parm1=abc&parm2=<%=serversideparm%>'。这样，只需在弹出窗口 querystring到这些参数，就实现了动态向弹出窗口传递信息。

将弹出窗口的信息传回父窗口

使用弹出传口的目的主要是为了同用户的交互，所以如何在父页面中得到用户对弹出窗口的操作结果是非常重要的。其实这里实现的方法也很简单，同样是通过 javascript：通过window.opener得到父窗口的window对象，就可以对父窗口进行操作，比如对某个textbox设值。

后记

当初为了实现这个简单的交互操作，花费了整整一下午的时间，关键是对javascript太生疏，自以为做server端的东西才是本事，其实是犯了大错。

另外，如果在js中引用.net server端对象遇到对象为空的报错时，很有可能是对象在编译后，vs对控件进行了重命名。一开始这里不知道，害得我好苦

关于有模式对话框和无模式对话框
参见下面的链接：
好的对话框的重要性
 http://www.microsoft.com/china/msdn/archives/technic/library/techart/dude09252000.asp