bs5 | Rails engine to include Bootstrap

I am using jQuery Datatable to visualize the information for the payments done by each user. I have created both "Edit" and "Delete" buttons in the table. However, the delete button is not working - I think I'm not triggering the Action method of my PaymentsController properly. My paymentsTable.js has the following script:

I am trying to use jQuery Datatables in my ASP.NET Core project. My Controller class has the following code:

I am using bootstrap select in my page and I need it to be empty by default (and value="") when the page loads (it is a required field so when the user submits the form, the validation message will appear in case it's empty).

It actually works but it looks weird/odd/too flat:

And this would be the desired result:

I have used this attribute to make the select look empty: data-none-selected-text="" and it actually looks empty but too flat.

If I remove that attribute, I'll get this Nothing selected placeholder which I don't want:

How can I make the design consistent and keep the same size whether something is selected or not?

I hope someone can help a numpty :)

I am using Boostrap 5 and this Lightbox library https://trvswgnr.github.io/bs5-lightbox/

It uses data-toggle="lightbox" to initiate it and is working perfectly.

I am using Boostrap 5 and this Lightbox library https://trvswgnr.github.io/bs5-lightbox/

It works fine on pages loaded normally but it will not load on AJAX loaded content.

I have tried this code to make it work with AJAX but it did not work.

I'm using the bundle Omines to create DataTables in Symfony 5 and I've written a custom query. However, when I do so, the search in the view doesn't work.

How I can fix it?

This is my code:

Controller

I've installed django-summernote and most of it works fine except for the dropdown buttons for Style, Font Size, Color and Table. The example has them setup as follows:

I am learning BS5, and I have a problem with the navbar side.

I followed this tutorial and example : https://www.codeply.com/p/LXYndDByBf

As you can see, the transition is fluid when the button "menu" is clicked.

I have done exactly the same (except the icons) here : https://template-admin-dom.herokuapp.com/3

And as you can see, the transition is not the same. And however, it is exactly the same code.

Can you inspect the code ? Perhaps I need some more js scripts ? (but I do not think so)

I have a React component that maps data from a .js file, containing objects in the array. How can I link my title and images from within this function to access respective pages?

In this file, I am getting errors for every [x] used for linking img src to the info.js file Is there a different way to link an img from a js array?