Asp.Net Ajax #1 Show/Hide ModalPopup using Javscript
We I first started to use the Asp.Net Ajax toolkit, I found there is a very fundamental requirement from a lot developers which we want to have some kinds of control on the client side, no need to trigger the service side event.
After I did some investigation, I found a very easy built-in way to do it.
The asp.net markup is like
1: <asp:Panel runat="server" ID="pnlDemo" style="display:none">
2: <h1>This panel is a test demo</h1>
3: </asp:Panel>
4:
5: <cc1:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="linkButton1"
6: PopupControlID="pnlDemo"
7: BackgroundCssClass="modalBlockBackground" BehaviorID="ModalPopupExtender"
8: DynamicServicePath="" Enabled="True">
9: </cc1:ModalPopupExtender>
If we want to use the javascript to control the popup, we can just simply to write the code like this:
1: if(!show)
2: {
3: $find('ModalPopupExtender').hide();
4: }
5: else
6: {
7: $find("ModalPopupExtender").show();
8: }
There is one thing need to be taken care which is the BehavirID, the code in the Javasctipt will look for the BehaviorID property for the ModalPopupExtender.
I hope this can be helpful for you.