locked
Override default Modalpopupextender show at OnClientClick event of Target button control RRS feed

  • Question

  • User1909155429 posted
    
    
     function addOption_list() {
              
      $find('mpeD').hide();
    }


    I am attempting to hide modal when condition is true in javascript function call. It appears that when this function is run and modal set to hide,it resets it to show again?
    How may i then call this function after modal show to then able to hide on condition true?

    <span> <asp:LinkButton ID="LinkFavourites" CssClass="" OnClientClick="addOption_list();" Text="Favourite & Saved List" runat="server"></asp:LinkButton> </span> </div> </div> <asp:Panel ID="PanelFav" CssClass="modalPopup" runat="server"> <h3>Select from list to view details</h3> <asp:ListBox ID="ListBox1" runat="server" onclick="SelectRedirect()" ToolTip="View item details" ></asp:ListBox><br /> <asp:Button ID="CloseModal" runat="server" Text="Close" /> </asp:Panel> <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtenderFav" runat="server" TargetControlId="LinkFavourites" BackgroundCssClass="modalBackground" PopupControlID="PanelFav" BehaviorID="mpeD" CancelControlID="CloseModal" DropShadow="true" />

    Sunday, October 4, 2020 2:07 PM

Answers

  • User1535942433 posted

    Hi peterthegreat,

    As far as I think,you understand that there is a mistake.

    Accroding to Modalpopupextender,you must set targetcontrolID.The value cannot be null or empty.

    There are two ways to trigger the Modalpopupextender:

    1.You use a Button and set the targetcontrolID.It is same with the button's ID.

    2.You could use BehaviorID. ASP.Net AJAX ModalPopupExtender Modal Popup can be shown using JavaScript using the BehaviorID property and hence it can be shown using any Button without setting the Button’s ID to the TargetControlID.

    Best regards,

    Yijing Sun

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 8, 2020 7:42 AM

All replies

  • User1535942433 posted

    Hi peterthegreat,

    Accroding to your description,I don't understand your requirment clearly.I'm guessing that when you click the linkbutton, it will show a modalpopupextender. If the click the close button,the modalpopupextender will be hidden.

    I have create a demo,just like this:

     <script>
            function addOption_list() {
                $find('mpeD').hide();
            }
            function SelectRedirect() {
                $find('mpeD').show();
            }
        </script>
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
            <div>
                <span>
                    <asp:LinkButton ID="LinkFavourites" CssClass="" OnClientClick="SelectRedirect();" Text="Favourite & Saved List" runat="server">
                    </asp:LinkButton>
                </span>
            </div>
            <div> 
                <asp:Panel ID="PanelFav" CssClass="modalPopup" runat="server">
                    <h3>Select from list to view details</h3>
                    <asp:ListBox ID="ListBox1" runat="server"  ToolTip="View item details"></asp:ListBox><br />
                    <asp:Button ID="CloseModal" runat="server" Text="Close" OnClientClick="addOption_list();" />
                </asp:Panel>
                <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtenderFav" runat="server" TargetControlID="LinkFavourites" BackgroundCssClass="modalBackground" PopupControlID="PanelFav" BehaviorID="mpeD" CancelControlID="CloseModal"  />
            </div>

    More details,you could refer to below article:

    https://www.aspsnippets.com/Articles/Use-ASPNet-AJAX-ModalPopupExtender-Modal-Popup-without-setting-TargetControlID.aspx

    Best regards,

    Yijing Sun

    Monday, October 5, 2020 2:38 AM
  • User1909155429 posted

    i discovered that i had to set target to a hidden control to open and close using script as shown in your example.

    Wednesday, October 7, 2020 1:14 PM
  • User1535942433 posted

    Hi peterthegreat,

    As far as I think,you understand that there is a mistake.

    Accroding to Modalpopupextender,you must set targetcontrolID.The value cannot be null or empty.

    There are two ways to trigger the Modalpopupextender:

    1.You use a Button and set the targetcontrolID.It is same with the button's ID.

    2.You could use BehaviorID. ASP.Net AJAX ModalPopupExtender Modal Popup can be shown using JavaScript using the BehaviorID property and hence it can be shown using any Button without setting the Button’s ID to the TargetControlID.

    Best regards,

    Yijing Sun

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 8, 2020 7:42 AM