CODEWITHSUNDEEP
scrollhandsontablerow-height
PuiuCristian
PuiuCristian

Reputation: 163

Handsontable - Change row height - jumpy scroll

I try to change the row height of the table with css

http://jsfiddle.net/aep5bo3r/1/

I added this to change the row height.

#basic_example td
{
     height: 15px!important;
    line-height: 15px!important;
    font-size: 10px;
}

The rows height is smaller, but now the scroll is .. jumpy?

With the default row height the cells are added nicely when scrolling, but if the rows are smaller, it won't add new rows until you scrolled past a certain portion.

I guess the javascript part doesn't like the new change.

If you can help me solve this, having smaller row height with an working scroll, it would be nice.

Thanks;

Upvotes: 1

Views: 772

Answers (2)

KiddoV
KiddoV

Reputation: 670

I know this is an old post, but incase someone is needed.

You need to change the CSS to:

.handsontable td, .handsontable th, .handsontableInput {
    height: 15px !important;
    line-height: 15px !important;
}

... and also add this option to the table:

{
...
rowHeights: 15,
}

Upvotes: 0

RDHanh
RDHanh

Reputation: 56

If I understand well so your problem will be solved if we add renderAllRows: true to your settings option when creating Handsontable object.

var hot = new Handsontable($('#tableContainerId')[0], {
         ...
         renderAllRows: true,
         ...
});

Upvotes: 1

Related Questions