I’m working on the form of website. I’m getting user id, topic, body from user in a form. I’m using bootstrap to validate topic with at least one non white space character. The body should have at least 12 characters excluding leading and trailing white spaces. It prints error message when user does not meet the requirements. However, I cannot get the body to have at least 12 characters.

I have problems with importing bootstrap in my JS file so i need to find an alternative to the event “hidden.bs.modal”. I need it to use it just like in this W3school example

I am trying to navigate to a nested tab by clicking a dropdown from the menu. Here in the below example i have a home tab with sub tabs inside them. I have a dropdown where i reference these subtabs of home. If i click that dropdown item, i must be redirected to the respective subtab of the home.
I am giving the id of sub tab for dropdown item as #submenu1. But this wont work as i have to first go to the home. So, if i use #home, then it will go to default selection.
What if i want to select submenu2 under the dropdown. It must go to Home and then Submenu2 under home.

I am playing with a very simple web page to learn to integrate HTML, CSS, JS and Bootstrap.

When the script is set to

Hello I have this error where the toast alert is not showing on the page when I log in but it is when I sign out, any idea why it does this? I tried multiple things like logging the toastLiveExample and the toastBody but it always returns null when I sign in showToast("text-bg-success", ${username}, you have successfully signed in! Check out your <a href="/profile/${username}">profile</a>!);

First off, this seems like a very simple question, but, the solutions I’ve found so far haven’t worked, they are mostly suggesting using jQuery, but, as I’m using Bootstrap 5, they have moved away from jQuery, so I’m hoping not to use that in favour of JavaScript if possible, or even just HTML if that is a thing.