CODEWITHSUNDEEP
javascriptjqueryasp.netvb.nettwitter-bootstrap
K.Olagon
K.Olagon

Reputation: 47

How can I prevent closing of bootstrap modal from dopostback?

My problem is when I selected any radio button list, the modal window will be closed. I used javascript change event then postback the asp rbl controller.

Actually, my entire code is inside the updatepanel. Please tell me the tricks or methods to prevent this problem.

Thanks you in advance.

javascript & aspx

$('#<%=rbl.ClientID %> input').change(function () {
  __doPostBack('<%: rbl.ClientID %>', '');
});
<asp:UpdatePanel runat="server" ID="panel">
  <ContentTemplate>
    
    <div class="modal fade" id="Modal">
      <div class="modal-dialog">
        <div class='panel panel-info'>
          <div class='panel-body'>
            <asp:RadioButtonList ID="rbl" runat="server">
              <asp:ListItem Value="add">Add</asp:ListItem>
              <asp:ListItem Value="remove">Remove</asp:ListItem>
            </asp:RadioButtonList>
          </div>
        </div>
      </div>        
    </div>                              
    
  </ContentTemplate>
</asp:UpdatePanel>

aspx.vb

Private Sub rbl_SelectedIndexChanged(sender As Object, e As EventArgs) Handles rbl.SelectedIndexChanged
    myFnc()
End Sub

Upvotes: 1

Views: 500

Answers (3)

KBC
KBC

Reputation: 43

On "OnSelectedIndexChanged" pass event like this

                `<asp:RadioButtonList ID="rbl" runat="server" OnSelectedIndexChanged="rbl_SelectedIndexChanged(event)">
                        <asp:ListItem Value="add">Add</asp:ListItem>
                        <asp:ListItem Value="remove">Remove</asp:ListItem></asp:RadioButtonList>`

After that do the necessary changes like below.

`$('#<%=rbl.ClientID %> input').change(function (event) {

__doPostBack('<%: rbl.ClientID %>', ''); event.preventDefault(); })` Your modal pop up will not be closed.

Upvotes: 0

Ravi
Ravi

Reputation: 320

You can use OnSelectedIndexChanged server side event of RadioButtonList with setting Autopost property to True to achieve same functionality. You don't need to fire post back through __doPostBack with 

$('#<%=rbl.ClientID %> input').change(function () {
  __doPostBack('<%: rbl.ClientID %>', '');
});

Upvotes: 0

Ali Soltani
Ali Soltani

Reputation: 9927

You can do it like below:

<div class="modal fade" id="Modal">
    <div class="modal-dialog">
        <asp:UpdatePanel runat="server" ID="panel">
            <ContentTemplate>
                <div class='panel panel-info'>
                    <div class='panel-body'>
                        <asp:RadioButtonList ID="rbl" runat="server" OnSelectedIndexChanged="rbl_SelectedIndexChanged">
                            <asp:ListItem Value="add">Add</asp:ListItem>
                            <asp:ListItem Value="remove">Remove</asp:ListItem>
                        </asp:RadioButtonList>
                    </div>
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
</div>

Upvotes: 2

Related Questions