Modal PopUp - Asp.Net Ajax control toolkit

Question

Hi Everybody, I'm using a ModalPopUp in an Asp.net application and would like to have it closing automaticaly when user clicks "esc".

I've used the following script:

<script language="JavaScript" type="text/javascript">

    function pageLoad() {
        $addHandler(document, 'keydown', onKeypress);
    }

    function onKeypress(args) {

        if (args.keyCode == Sys.UI.Key.esc) {

            var mdl = $find('modalExtender').hide();

        }
    }

</script>

And the Modal Extender is declared like that:

        <cc1:ModalPopupExtender 
            ID="modalExtender" 
            runat="server" 
            TargetControlID="btnPreview"
            PopupControlID="PreviewPanel"
            BackgroundCssClass="modalBackground"
            DropShadow="true"
            CancelControlID="btnFechar" />

When I press the "esc" key I'm getting this error: "Microsoft JScript runtime error: 'null' is null or not an object"

Has someone had the same problem? How was it solved? Thank you in advance.

Josimari Martarelli

Answer 1

This may work for both IE and Moozilla

document.onkeyup = KeyCheck;
function KeyCheck(e)
{
   //Ternary check to cover FF or IE
   var KeyID = (window.event) ? event.keyCode : e.keyCode;
   if (KeyID = '27') {
   //Close Popup
   var mdl = $find('modalExtender').hide();
  }
}

Answer 2

Shouldn't your $find be looking for the control PreviewPanel instead of the extender? I believe your $find is returning a null because there is no HTML control with the name modalExtender.

Also, you probably need to get the ClientId for PreviewPanel instead of the ASP.NET Control name (if my guess that PreviewPanel is an ASP.NET Control is correct).

Answer 3

Have a look at this blog post: link text

Answer 4

It is working now, I was missing the BehaviorID of the ModalPopUp...