Search code examples
asp.nettwitter-bootstrapupdatepanel

UpdatePanel inside a bootstrap modal doesn't update


I change the label's text that resides with a UpdatePanel that is within a Bootstrap Modal. When the Modal pops up, the text has not been set (through in debugging I can see it sets the labels text correctly with the error message).

This modal resides and is called from within a UserControl.

What am I missing? Why isn't the UpdatePanel being triggered?

<%--ERROR MODAL--%>
<asp:Panel runat="server" class="modal fade" ID="modalErrorMessage" role="dialog" aria-labelledby="modalErrorMessage" aria-hidden="true">
<div class="modal-dialog">
    <asp:UpdatePanel runat="server">
        <ContentTemplate>
            <div class="modal-content panel-danger">
                <div class="modal-header panel-heading"><span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span> Error!</div>
                <div class="modal-body">
                    <asp:Label runat="server" ID="lblmodalErrorMessage" Text=""></asp:Label>
                    <br />
                    <div class="modal-footer margin-top-sm">
                        <asp:Panel runat="server" ID="Panel2">
                            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        </asp:Panel>
                    </div>
                </div>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

    Private Sub RaiseErrorMessageModal(errorMessage As String)
        lblmodalErrorMessage.Text = errorMessage
        RegisterModalPopup(modalErrorMessage.ClientID)
    End Sub



    Protected Sub RegisterModalPopup(modalId As String)
        Dim script = String.Format("$('#{0}').modal();", modalId)
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), modalId,
                                            script, True)
    End Sub

Solution

  • You should specify an ID for your UpdatePanel and also set the UpdateMode property to indicate how the update panel should update/refresh its content.

    <asp:UpdatePanel runat="server" ID="UpdatePanel123" UpdateMode="Conditional">
    

    In your code where you set the text of the Label you should call the .Update() event of the UpdatePanel:

    //Depending on where this code is, you may need to find your UpdatePanel control.
    Private Sub RaiseErrorMessageModal(errorMessage As String)
        lblmodalErrorMessage.Text = errorMessage
        UpdatePanel123.Update()
        RegisterModalPopup(modalErrorMessage.ClientID)
    End Sub
    

    MSDN reference: https://msdn.microsoft.com/en-us/library/system.web.ui.updatepanel.updatemode(v=vs.110).aspx?cs-save-lang=1&cs-lang=vb#code-snippet-1