asp.net ModalPopupExtender实现指定位置弹出

概述:
      最近由于快速开发用了微软的ajaxcontroltoolkit,实现点击添加然后弹出一个搜索框去选择添加数据的功能
      但是由于页面比较长并且弹出框是居中显示的,所以很多时候不是在屏幕中间显示的,这就需要在页面中设置弹出框的位置
解决方案:
      首先我试着用document.getElementById().style.top去设置他的垂直位置,但是如果你的弹出框中有服务器按钮,比如搜索,即使你在弹出框中放了updatepanel,在数据回发加载后弹出框口的位置会自动回到整个页面的中间,可能是因为我们只是用js去设置的弹出框口的位置,但是服务器并不知道,所以在加载后又重新设置的弹出窗口的位置.
      最后我看了下弹出窗口的js代码,如下:

Code
<script type="text/javascript">
    $addHandler($get("lnkLuRulesShowSearch"), 'click', LuRules_showModalPopupViaClient);
    $addHandler($get("lnkLuRulesReturn"), 'click', LuRules_hideModalPopupViaClient);
    function LuRules_showModalPopupViaClient(ev) {
        ev.preventDefault();
        var modalPopupBehavior = $find('LuRules_programmaticModalPopupBehavior');
        modalPopupBehavior.show();
    }
    function LuRules_hideModalPopupViaClient(ev) {
        ev.preventDefault();
        var modalPopupBehavior = $find('LuRules_programmaticModalPopupBehavior');
        modalPopupBehavior.hide();
    }
</script>

      我们看到他弹出窗口是modalPopupBehavior.show();这样来弹出来的,所以我们可以加一个debugger然后可以看到modalPopupBehavior有一个set_Y的方法:
      modalPopupBehavior.set_Y(getElementPos("lnkLuRulesShowSearch").y);
      getElementPos是一个辅助js方法用来获取lnkLuRulesShowSearch这个按钮的位置的,最终代码如下:

Code
<script type="text/javascript">
    // Add click handlers for buttons to show and hide modal popup on pageLoad
    $addHandler($get("lnkLuRulesShowSearch"), 'click', LuRules_showModalPopupViaClient);
    $addHandler($get("lnkLuRulesReturn"), 'click', LuRules_hideModalPopupViaClient);
    function LuRules_showModalPopupViaClient(ev) {
        ev.preventDefault();
        var modalPopupBehavior = $find('LuRules_programmaticModalPopupBehavior');

        modalPopupBehavior.set_Y(getElementPos("lnkLuRulesShowSearch").y);

        modalPopupBehavior.show();
    }
    function LuRules_hideModalPopupViaClient(ev) {
        ev.preventDefault();
        var modalPopupBehavior = $find('LuRules_programmaticModalPopupBehavior');
        modalPopupBehavior.hide();
    }
</script>

      这样弹出的窗口即使页面回发也不会改变弹出的位置
      希望对遇到同样问题的朋友有所帮助:)

转载于:https://www.cnblogs.com/zrx401558287/archive/2009/09/21/1570789.html