Scroll Bar Issue

genesys_kumar

Code Link: https://github.com/ramkumar2325/DataTable_Sample

I have uploaded source code here, I'm trying setup vertical scroll bar based on the example given.

let table = $('#agentSelectionTable').DataTable({
data: availableAgents,
scrollCollapse: true,
scrollY: '50vh',
"columns": [{
"data": "userName"
},
{
"data": "firstName"
},
{
"data": "lastName"
},
{
"data": "startDate"
},
{
"data": "endDate"
},
{
"data": "replacementAgent"
},
{
"data": "comment"
}
],
columnDefs: [{
targets: 6,
render: $.fn.dataTable.render.ellipsis(20)
}],
"createdRow": function (row, data, index) {
if (data.replacementAgent != "") {
$('td', row).eq(5).addClass('highlight');
}
}
});

Issue is: Column header shrinking (attached screenshot for reference)
Scenario is: from the screenshot you can see page design and I'm loading Datatable in one of the DIV on right bottom. I've 2 monitor's. On one monitor i can see all 10 rows and on second monitor i can see only 5 rows so when i move page from one screen to another screen i'm resizing the screen so i need to setup scrollY param value dynamically.

Question: how to setup the scrollY value dynamically when resizing the page and why the column header is shrinking

Please help me with this issue.

Thanks,
Kumar

genesys_kumar

First images shows initial page load and Datatable view
Second View - on big screen all seems good except the scrollY is "150Px" - which i need help to setup dynamically
Third View - on small screen all seems good.

allan

Hi,

Thanks for putting the test case together. However, it looks like there are a bunch of scripts missing I'm afraid:

I haven't been able to run it to identify what the issue is.

Thanks,
Allan

allan

Part of the issue was my file system is case sensitive, so I moved scripts to Scripts and a few of the files loaded, but there are still errors unfortunately and nothing appears to happen.

Allan

genesys_kumar

Hi Allan,

First I apologize, i have created a separate discussion where Kevin is checking with the test case "http://live.datatables.net/sexicozi/1/edit?html,css,js,console,output".

Please forgive me for the duplicate request