Topic: Why is not expand/collapse working as the demo?
Expected behavior Expand/collapse is not working. Running development on a Docker container with Nginx and PHP (richarvey/nginx-php-fpm). The browser's development tools do write out the hidden div:s but expanding the row to view them does not work
Actual behavior Expand/collapse functioning as intended
Resources (screenshots, code snippets etc.) Followed guide: https://mdbootstrap.com/snippets/jquery/cam/979615#html-tab-view
Running the code from the linked guide with this header (and of course closing HTML tags):
<html>
<head>
<meta http-equiv="refresh" content="<?php echo $sec?>;URL='<?php echo $page?>'">
<title>DevEnv</title>
<!-- Font Awesome -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet"/>
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet"/>
<!-- MDB -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/4.2.0/mdb.min.css" rel="stylesheet"/>
<!-- MDB -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/4.2.0/mdb.min.js"></script>
<link href="stylesheet.css" rel="stylesheet"/>
</head>
This example does not work because it was created for MDB4 jQuery but you are using MDB5.
You need to update the data attributes. For example, in MDB5, the data-toggle="collapse" attribute it also has mdb and looks like this: data-mdb-toggle="collapse"
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 4.2.0
- Device: Macbook Pro
- Browser: Google Chrome
- OS: MacOS
- Provided sample code: No
- Provided link: Yes