Close Bootstrap alert using data dismiss attribute in ASP.Net

nadeem12...

SOLVED CLOSED ACTIVE ANSWERED
User: nadeem1218
Posted: on Dec 13, 2016 02:30 AM
Forum: Data Controls
Answer: 1
Views: 5400
Sample Code: Download

Hello,

I'm trying to use the Bootstrap alert plugin's in Asp.Net.

Below is my code for reference

 <!-- JQUERY SCRIPTS -->
    <script src="../assets/js/jquery-1.10.2.js" type="text/javascript"></script>
    <!-- BOOTSTRAP SCRIPTS -->
    <script src="../assets/js/bootstrap.min.js" type="text/javascript"></script>
    <!-- METISMENU SCRIPTS -->
    <script src="../assets/js/jquery.metisMenu.js" type="text/javascript"></script>
    <!-- CUSTOM SCRIPTS -->
    <script src="../assets/js/custom.js" type="text/javascript"></script>

and the HTML code.

<div class="alert alert-success alert-dismissable">
<button type="button" class="close" data-dismiss-"alert" aria-hidden="true">x</button>
<asp:Label runat="server" ID="lblSuccessAlert" Text="New Branch Added Successfully"></asp:Label>
</div>

But I'm unable to close the alert when I press the "X" button. Is there any issues with the scripts? please help me.

dharmend...

0 1

Reply
ANSWER
User: dharmendr
Replied: on Dec 13, 2016 02:31 AM
Report

Hi nadeem1218,

Refer the below code.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div class="alert alert-success alert-dismissable">
        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
            x</button>
        <span id="lblSuccessAlert">New Branch Added Successfully</span>
    </div>
    </form>
</body>
</html>

Demo

nadeem1218 says:
data-dismiss-"alert"

Here is the problem. Instead of "=" you have written "-"

Close Bootstrap alert using data dismiss attribute in ASP.Net

Company

Explore

Follow us

Contact Us