<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="./dist/bootstrap5-editable/css/bootstrap-editable.css"> <!-- <script src="./dist/bootstrap5-editable/js/bootstrap-editable.js"></script>--> <!-- <script src="./dist/jquery.js"></script>--> <script src="./dist/app.js" type="module"></script> <title>Bootstrap 5.3.3 Test</title> </head> <body> <div class="container"> <h1 class="text-primary">jQuery 3.7.1 & Bootstrap 5.3.3 Test</h1> </div> <form id="test-form" action="test.php" method="post"> <div class="container mb-3"> <h3>Test X-Editable Yes/No Switch</h3> <p>Click on the text below to toggle Yes/No:</p> <a href="#" id="yes-no-switch" class="editable editable-click" data-type="select" data-pk="1" data-title="Select Yes/No" > Yes </a> </div> <div class="container"> <h3>Test X-Editable Datepicker</h3> <p>Click to select a date:</p> <a href="#" id="datepicker" class="editable editable-click" data-type="date" data-pk="1" data-title="Select Date" > Yes </a> </div> </form> </body> </html>