asp.net ModalPopupExtender实现指定位置弹出
概述:
最近由于快速开发用了微软的ajaxcontroltoolkit,实现点击添加然后弹出一个搜索框去选择添加数据的功能
但是由于页面比较长并且弹出框是居中显示的,所以很多时候不是在屏幕中间显示的,这就需要在页面中设置弹出框的位置
解决方案:
首先我试着用document.getElementById().style.top去设置他的垂直位置,但是如果你的弹出框中有服务器按钮,比如搜索,即使你在弹出框中放了updatepanel,在数据回发加载后弹出框口的位置会自动回到整个页面的中间,可能是因为我们只是用js去设置的弹出框口的位置,但是服务器并不知道,所以在加载后又重新设置的弹出窗口的位置.
最后我看了下弹出窗口的js代码,如下:
modalPopupBehavior.set_Y(getElementPos("lnkLuRulesShowSearch").y);
getElementPos是一个辅助js方法用来获取lnkLuRulesShowSearch这个按钮的位置的,最终代码如下:
希望对遇到同样问题的朋友有所帮助:)
最近由于快速开发用了微软的ajaxcontroltoolkit,实现点击添加然后弹出一个搜索框去选择添加数据的功能
但是由于页面比较长并且弹出框是居中显示的,所以很多时候不是在屏幕中间显示的,这就需要在页面中设置弹出框的位置
解决方案:
首先我试着用document.getElementById().style.top去设置他的垂直位置,但是如果你的弹出框中有服务器按钮,比如搜索,即使你在弹出框中放了updatepanel,在数据回发加载后弹出框口的位置会自动回到整个页面的中间,可能是因为我们只是用js去设置的弹出框口的位置,但是服务器并不知道,所以在加载后又重新设置的弹出窗口的位置.
最后我看了下弹出窗口的js代码,如下:
Code
我们看到他弹出窗口是modalPopupBehavior.show();这样来弹出来的,所以我们可以加一个debugger然后可以看到modalPopupBehavior有一个set_Y的方法:modalPopupBehavior.set_Y(getElementPos("lnkLuRulesShowSearch").y);
getElementPos是一个辅助js方法用来获取lnkLuRulesShowSearch这个按钮的位置的,最终代码如下:
Code
这样弹出的窗口即使页面回发也不会改变弹出的位置希望对遇到同样问题的朋友有所帮助:)
本站文章除做特殊声明则一律属于原创,转载请注明出处
--周瑞喜(rain.zhou)
开源分享使人进步,使技术进步,使社会进步