CODEWITHSUNDEEP
jquerytwitter-bootstrap
kkh
kkh

Reputation: 4869

twitter bootstrap alert hide on initialization

I am using twitter bootstrap for my alerts and I want an alert to appear when there is an error in the inputs. I can hide it on initialization and show it once an error occurs. But after that the alert disappears again. is there any way to ensure that the alert stays there until the correct input is given

<div class="span4">  
                <div class="alert alert-error  fade in" id = "user_name_exist" >  
                   <button type="button" class="close">×</button>
                  <h4 class="alert-heading">Username error!</h4>  
                    The username entered is used by another user. Please choose another one!
                </div>  
</div>

anyone can help me?

Upvotes: 6

Views: 15643

Answers (3)

Aviral
Aviral

Reputation: 1141

This is an old question, but the following worked for me (from a different answer on stackoverflow, but I cannot find the link to that answer anymore). Hope this helps someone.

$('.alert .close').on("click", function(e) {
e.stopPropagation();
e.preventDefault();
$(this).parent().hide();
});

Upvotes: 0

Todd A
Todd A

Reputation: 106

For what it's worth, I'm not a fan of editing downloaded packages. I have the same thing on my end but what I did was just remove the data-dismiss="alert" part of the close button. Then used basically the same code that Nintin has above to hide the alert.

HTML code

<div id="AddAlert" class="alert alert-block" style="display:none;">
  <button type="button" class="close">&times;</button>
  <h4 id="AddAlertH4">Error</h4>
  <div id="AddAlertMessage">My error message goes here.</div>
</div>

JS code

$(".close").click(function(){
    $("#AddAlert").hide();
});

I also dynamically populate my error messages using PHP but I didn't outline that here as it's not part of the question.

Upvotes: 5

Nitin Bourai
Nitin Bourai

Reputation: 458

You need to Remove the Line from bootstrap-alert.js file

function removeElement() {
  $parent
    .trigger('closed')
    .remove()
}

Remove .remove() and save the js file

than add Javascript in your code to manually close ex 

    $(".close").click(function(){
$("#myalert").hide();
 });

Upvotes: 0

Related Questions