locked
not showing ajax modal popup from javascript. RRS feed

  • Question

  • User-2066630380 posted

    So I have two options here. on an asp button with id="Btn1"  I have OnClientClick="popConfirm()" or I could do this from code behind Btn1.OnClientClick = String.Format("popConfirm()") and so forth.  I want to be able to master both here but ultimately choose either one in different scenarios.

    Problem 1: The problem I'm facing that I can't stop the code behind version to stop and wait for a confirm button clicked in the modalpopup. It will just continue to run code. Is there something I'm doing wrong here. How can I get it to stop and wait and listen that confirm has been clicked?

    Problem 2: If I use javascript function popConfirm(), its not finding the ajaxmodalpopup control and I've even (I think) properly resorted to using the BehaviorID.  It just returns null object found. Here below is this version.

    <script type="text/javascript">
        function popConfirm() {
            var theModal = $find('confirmPopUp');
            theModal.show();
            return false;
        }
    
    </script>
    
          <asp:Button runat="server" ID="inviteall" CssClass="btn btn-default" OnClientClick="popConfirm()" meta:resourcekey="InviteAll" CommandName="InviteSelected" Visible='<%# SurveyControlPanel1.IsPublished && SurveyControlPanel1.AllowInvites %> ' />
                       
    
    
        <!--.modal-content -->
        <asp:ImageButton ID="imgHiddenConfirm" runat="server" CausesValidation="false" Style="display: none" />
        <ajaxToolkit:ModalPopupExtender ID="confirmModalPopup" runat="server"  BackgroundCssClass="modalBackground" BehaviorID="confirmPopUp" CancelControlID="PopupCloseButton" PopupControlID="pnlConfirm" TargetControlID="imgHiddenConfirm">
        </ajaxToolkit:ModalPopupExtender>
        <asp:Panel ID="pnlConfirm" runat="server" CssClass="modalPopup" Style="display: none">
    
    
            <div id="mod-info4">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
        
                        </div>
                        <div class="modal-body">
                            <div class="text-center">
                                <div class="i-circle info"><i class="fa fa-info"></i></div>
                                <h3>Invite(s)</h3>
                                Are you sure you want to send invites to selected users?
                                
                            </div>
                        </div>
                        <div class="modal-footer">
                            <asp:Button ID="btnClose" runat="server" CssClass="btn btn-default" Text="Ok" />
                            <asp:Button ID="btnConfirm" runat="server"  Text="Confirm" />
                        </div>
                    </div>
                </div>
    
            </div>
        </asp:Panel>
        <!-- /.modal-content -->
    
    

    So what's going on here in both scenarios? thanks for any help

    Saturday, November 1, 2014 8:00 AM

Answers

  • User-1360095595 posted

    Change this: 

    OnClientClick="return popConfirm();"
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, November 1, 2014 8:56 AM

All replies

  • User-1360095595 posted

    Change this: 

    OnClientClick="return popConfirm();"
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, November 1, 2014 8:56 AM
  • User-2066630380 posted

    Hi, yes that worked out along with another small adjustment, but now with half of this problem solved, I get the following very bizarre manifestation.

    I have two pages completely identical that use this function and button. On one page this works perfectly on the other for some reason the button is not passing the  source (source being the buttonId. it works on the other page with "this". Is there any reason why its not passing or defining the source assigned to the onclientclick value from the button? and why would this work on another page? could this be DOM issue? its simply not passing the value to the javascript.  by the way the modal exists, checked that so that's not it.

    Here is the adjusted function and button that works on one page but not the other. So it hangs on this._popup.show(); stating the following
    JavaScript runtime error: Unable to get property 'show' of undefined or null reference

    update... I added a watch to these and the values for popup and source are correctly passed. So why the undefined error?

    //for Confirmation message Popups SystemWide
    function popConfirm(popup, source) {
            this._source = source;
            this._popup = $find(popup);
            this._popup.show();
            return false;
    }
    
    
    
     <asp:Button runat="server" ID="delall" CssClass="btn btn-danger"  OnClientClick="return popConfirm('confirmDeletePopUp', this); return false;" 
                                                    meta:resourcekey="DeleteAll" CommandName="DeleteSelected"/>

    Sunday, November 2, 2014 3:47 AM
  • User-2066630380 posted

    I figured this out for those of you interested. One page had EnableEventValidation="false" set to true and the other didn't.  Since this is not a critical operation I set them to false and it worked.

    Sunday, November 2, 2014 5:46 AM