Topic: Close button not working in WooCommerce
goodfellastech pro premium priority asked 1 months ago
Expected behavior I am trying to use the close button to get the alert from woocommerce to close so that if a user does something on a custom store it will be closed. I made sure that I used the alert in the container div class. This is a local enviornment, but I am guessing this might be a js plugin issue.
Actual behavior Right now you click on the button and it does what it looks like is an animation action, but it does not hide the alert.
Resources (screenshots, code snippets etc.)
<?php foreach ( $notices as $notice ) : ?>
<div data-mdb-alert-init class="alert alert-danger" role="alert" data-mdb-color="danger" <?php echo wc_get_notice_data_attr( $notice ); ?>>
<div class="d-flex justify-content-between">
<div><i class="fas fa-times-circle me-3"></i> <?php echo wc_kses_notice( $notice['notice'] ); ?></div>
<div><button type="button" class="btn-close" aria-label="Close" data-mdb-ripple-init data-mdb-dismiss="alert"></button></div>
</div>
</div><?php endforeach; ?>
goodfellastech pro premium priority answered 1 months ago
<div class="alert alert-dismissible fade show <?php echo wc_get_notice_data_attr( $notice ); ?>" role="alert" data-mdb-alert-init data-mdb-color="danger">
<i class="fas fa-info-circle me-3"></i> <?php echo wc_kses_notice( $notice['notice'] ); ?>
<button type="button" class="btn-close" data-mdb-dismiss="alert" aria-label="Close"></button>
</div>
I read the docs wrong. I did nore realize to have the dismissable context you have to have classes "show" and "fade" to trigger the action.
Kamila Pieńkowska staff commented 4 weeks ago
So do you need any help?
goodfellastech pro premium priority commented 3 weeks ago
I figured it out and wanted to post the answer for anyone else to see.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 7.3.2
- Device: Mac
- Browser: Chrome
- OS: Sequoia 15.0.1
- Provided sample code: No
- Provided link: No