FixedColumns | Fix one or more columns in place on a scrolling

I am using DT::datatable() in an R Shiny app to render a table with the header and first column fixed. My app has multiple tabs. I've tried two different approaches but both have bugs that make them unusable. I'm aware that these issues have been reported but I was wondering if anyone knows a workaround that would work in my case.

Approach # 1: scrollY

Here I set scrollY = "500px" in options. The problem is that when I change the number of entries to something other than 10, when I scroll to the bottom, the first column is misaligned with the other columns.

I am trying to create a shinyApp with a data table from the DT package. Whenever a field is NA/blank in the table, I want to highlight it in red color.

I created a reproducible example using part of the iris dataset and creating some NA-values.

I have two HTML widgets on my WordPress webpage. Both function the same way: colour changes on button click - only WHITE and BLACK are functional right now, I am yet to render the other colours. I need to have several of these widgets on a single page (8 or so) and although they have different IDs and function names, only Widget A works and Widget B doesn't change to black/white and only shows the initial image.

On it's own, Widget B works perfectly so I am having trouble figuring out what more to do to make both function on the same page.

Any advice is appreciated.

View image: https://ibb.co/Ct98ggj

Widget A:

I have looked at the documentation, and examples, and other answers. But, for the life of me, I can't get the DT::datatable() to widen just one column in my output. When I set the option to include _all columns, it works, but obviously not what I want.

Here is a working example:

I have this piece of code. The DT datatable does not render at all. It shows the columns, and nothing else. I posted a related question earlier, but apparently, this issue needed to be posted as a separate question. I am.

Any idea of what I am missing?

I'm learning Laravel framework and I wanted to add Select2 to my project with Laravel-mix. After many hours of trying to do that, I did it and everything seems to work fine, except one little, but very annoying issue.

When I click on my , the search input inside is not focused, so it looks like that: Okay, that not so bad, but when I click on the search input the black line flashes for less than 0,5sec: And after that this line looks like it should (pay attention that on the first image the line was missing): I'm not pretty sure, which lines of my code should I provide. I used npm i select2 command to install select2. Then I used composer require ttskch/select2-bootstrap4-theme command to install better look for bootstrap. webpack.mix.js mix.js('resources/js/app.js', 'public/js') .sass('resources/sass/datatables.scss', 'public/css') .sass('resources/sass/app.scss', 'public/css') .postCss('vendor/ttskch/select2-bootstrap4-theme/dist/select2-bootstrap4.min.css', 'public/css') .postCss('node_modules/select2/dist/css/select2.min.css', 'public/css') .sourceMaps(); bootstrap.js try { window.jQuery = window.$ = require('jquery'); window.Popper = require('popper.js').default; require('bootstrap'); require('select2'); require( 'jszip' ); require( 'pdfmake' ); require( 'datatables.net-bs4' )(); require( 'datatables.net-buttons-bs4' )(); require( 'datatables.net-buttons/js/buttons.html5.js' )(); require( 'datatables.net-buttons/js/buttons.print.js' )(); require( 'datatables.net-datetime' )(); require( 'datatables.net-fixedcolumns-bs4' )(); require( 'datatables.net-fixedheader-bs4' )(); require( 'datatables.net-keytable-bs4' )(); require( 'datatables.net-responsive-bs4' )(); require( 'datatables.net-rowgroup-bs4' )(); require( 'datatables.net-rowreorder-bs4' )(); require( 'datatables.net-scroller-bs4' )(); require( 'datatables.net-searchbuilder-bs4' )(); require( 'datatables.net-searchpanes-bs4' )(); require( 'datatables.net-select-bs4' )(); } catch (e) {} app.js jQuery(function () { $(".s2").select2({ theme: 'bootstrap4', focus: true }); }); app.blade.php ... Your choice Option 1 Option 2 ...

Please help me to understand my mistake and how to fix it. I have never used any framework before, so in my other projects I just added maybe about three lines of code and everything worked well, but here I feel totally lost.

I'm having a trouble on how can I implement export file in vue.js using datatable in laravel. I know it is common to ask this problem, but I couldn't find a way yet. When I click button it should automatically download the datatable data in excel. It would be great if anybody could help me out, thank you so much in advance!.

I have these two buttons

I'm using DT to build an HTML table and I keep having this massive white space and can't seem to sort out how to get the columns to strength the page. An additional side note is that my left column fix doesn't seem to be fixing when setting scrollX = TRUE.

Here is an example:

In the example that I posted below, I have a df with 100 rows and 100 columns with numeric values (except the first column) that I would like to print with sequential color scale on the main panel in Shiny. Since all columns don’t fit in a single window, I would like to use horizontal scrolling while keeping the first column fixed. Here is my attempt at it. Not sure where I am going wrong. As you can see, I am using DT package. I would appreciate if someone can also show me the solution with reactable package.