Question

141

My Bootstrap alert will not display after being closed

rated 0 times [ 145] [ 4] / answers: 1 / hits: 42428 / 11 Years ago, tue, december 10, 2013, 12:00:00

Hi I have the following alert that is hidden on the page

<div class=alert alert-success id=selectCodeNotificationArea hidden=hidden>

    <button type=button class=close data-dismiss=alert>&times;</button>

    @TempData[selCode]

</div>

I display it with the following javascript

    $('#send_reject_btn').click(function () {

        var selRowIds = $(#ApprovalGrid).jqGrid('getGridParam', 'selarrrow');

        if (selRowIds.length > 0) {

            $('#reject_alert').show();

        } else {

            $('#selectCodeNotificationArea').show();

        }

    });

This is obviously linked to a button in my html.

After the alert is shown if I close it using the<button type=button class=close data-dismiss=alert>×</button> The next time I press the button to open the alert I can see $('#selectCodeNotificationArea').show(); being called in my debug screen but the alert doesn't display again.

Has anyone experienced this before?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

irvingcarloe

Add To Favorites

Follow

Total Points: 677

Total Questions: 109

Total Answers: 96

Location: Svalbard and Jan Mayen

Member since Sun, Sep 25, 2022

2 Years ago

irvingcarloe questions

1 Is it better to use multiple states or one state object in React?

Wed, Aug 10, 22, 00:00, 2 Years ago

1 Tailwind classes not working after page refresh in production

Fri, Jun 4, 21, 00:00, 3 Years ago

1 Event listener for dataLayer push events on Tag Manager JS

Wed, Mar 31, 21, 00:00, 3 Years ago

1 Convert file to Base64

Tue, Aug 4, 20, 00:00, 4 Years ago

1 How to autoplay audio in any browser?

Fri, Jul 3, 20, 00:00, 4 Years ago

View All

answered 11 Years ago kenyonmasonc · Accepted Answer

The Data-dismiss completley removes the element. You would need to hide the alert if you are intending on showing it again.

For example;

<div class=alert alert-success id=selectCodeNotificationArea hidden=hidden>

    <button type=button class=close data-hide=alert>&times;</button>

    @TempData[selCode]

</div>

and this JS

$(function(){

    $([data-hide]).on(click, function(){

        $(this).closest(. + $(this).attr(data-hide)).hide();

    });

});