I have a Rails 7 App that I’m using Importmap with. I’m loading the Bootstrap JS via the gem and docs so my config/importmap.rb has: config/initializers/assets.rb application.js Stuff like dropdowns activated via data attributes work well but my custom JS gives the error: Uncaught TypeError: bootstrap.Popover is not a constructor Answer How to initialize Popper (tooltips) with importmaps You’re very
Tag: twitter-bootstrap
Programmatically toggle Bootstrap 5 collapse component
I’m using a boostrap 5 “collapse”, using the data attributes approach. It works as expected. I can click the button to collapse/expand the collapsible items. The docs state I can toggle the state manually, like so: However that fails, as getInstance returns null. Strangely, if I click the collapse button, then use that code, it works. How do I ensure
Bootstrap CSS positioning
The words or text below the logo in the navbar are not moving to the right of the logo (for reference link to the page -> http://127.0.0.1:5500/index.html). Additionally the logo is not shifting to its left – it’s happening in basically all the navbar codes. I’m trying to do this using CSS bootstrap. Any explanation would be very helpful since
Bootstrap-select won’t drop down when clicked in ASP.NET web application
I am building an ASP.NET web application, and I am having serious trouble getting bootstrap-select to work properly. I have looked at other posts on SO on this, and nothing seems to fix the issue, so I’m hoping I can get some help today. The web application uses a master page, which contains the following declarations to include all of
Javascript Bootstrap Multiselect – Show search dropdown if no options available
I’m using bootstrap-multiselect (https://github.com/davidstutz/bootstrap-multiselect) and want to dynamically load the data similar to bootstrap multiselect search get value from database, but on initial start there are no option values available, then by default the search dropdown is not showing. How can I still open/show the search dropdown if no options are available? Here is a fiddle: https://jsfiddle.net/mwd4ag3h/ html: js: Answer
How can I add animation to Bootstrap dropdowns?
How can I add animation to the dropdown? I assume by modifying popperConfig, but how? At the moment dropdown-menu has a generated inline style, e.g. position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate3d(0px, 40px, 0px); Of course I can just add transition: translate .3s ease to it, but what if I want to change the direction or
JS Toggle Submenu within Mega Menu
The issue I’m having is, creating a submenu inside another menu. Demo: LIVE DEMO (Important, cause CSS is needed as well I’m having this Bootstrap Mega Menu, which also contains a submenu (Column 2). On click, it should hide Column 3, and show the submenu items. (it does its job) Currently, I’m grabbing the submenu content with jquery html() and
Bootstrap 5 tooltip placement top issue when page has a scroll
I have an issue with tooltips in bootstrap when the placement top is forced. I use the latest version for now: 5.1.3 I have tried to create a code snipped, but the issue is not reproducible on codepen, so I will paste a code here with a video sample. When I scroll the page a bit down to see see
Image uploading in Angular
I was trying to upload an image using Angular to a google storage bucket. And everything is working fine with Postman. But I’m stuck with angular typescript. Can anyone suggest to me a way to do this? .html file .ts file } .service file } No any error occurs on the backend side. It worked fine with Postman. Im not
Looping through selectpicker options
I am working with a selectpicker that contains optgroup and option elements. I would like to loop through the options and “select” all options that have a value starting with a certain string. For example, if I have the following: and some buttons “Vegetable” and “Fruit”, I would like all of the options that have values starting with “V.” to