jQuery UI Widgets Forums Lists ListBox Disable horizontal scrollbar?

This topic contains 9 replies, has 6 voices, and was last updated by  Hristo 4 years ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • Disable horizontal scrollbar? #45103

    Nicolas
    Participant

    Hi,
    I need to disable the horizontal scrollbar of my listbox. When the content of one my cells is too big, I would like to do something like text-overflow:ellipsis does in CSS.

    But it doesn’t look there an API for this. And doing it only with CSS seems cumbersome do to.

    So, is there a way to do this?

    Regards

    Disable horizontal scrollbar? #45350

    Dimitar
    Participant

    Hello Nicolas,

    Unfortunately, this feature is not available in jqxListBox.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Disable horizontal scrollbar? #45467

    Nicolas
    Participant

    Ok thank you! I guess I will will calculate the width of the content I put in the source, and make sure it’s not too big. But may be this could be a nice API to add 🙂

    Regards

    Disable horizontal scrollbar? #45475

    Peter Stoev
    Keymaster

    Hi Nicolas,

    I would like to add something here, too. The jqxListBox has a property called “autoItemsHeight”. When it is turned on, the long items would be wrapped in several lines which will result in no horizontal scrollbar.

    Hope this helps.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

    Disable horizontal scrollbar? #45513

    Nicolas
    Participant

    Thanks Peter! Didn’t thought about this possibility. It works fine! Even if I use a custom renderer!

    Disable horizontal scrollbar? #58774

    npayot
    Participant

    Hi,

    Topic is a bit old but this issue happened to me so just in case someone’s looking for a solution:
    – Wrap each row into a css class with `{ width: 100px; text-overflow: ellipsis; overflow: hidden; }’
    – Remove the horizontal scrollbar once the source’s loaded and reduce listbox height by 20

    var horizontalScrollBarId = '#horizontalScrollBar + 'listboxId';
    var horizontalScrollBar = $('#listboxId').find(horizontalScrollBarId);
    // Horizontal scrollbar exists
    if (horizontalScrollBar.length > 0) {
        horizontalScrollBar.remove();
        $('#listboxId').css('height', $('#listboxId').height() - 20);
    }

    Regards,

    • This reply was modified 7 years, 10 months ago by  npayot.
    Disable horizontal scrollbar? #58786

    npayot
    Participant

    Actually the horizontal scrollbar is always present on the DOM. It’s better to check for the visibility and hide it it’s visible:

    var horizontalScrollBarId = '#horizontalScrollBar' + 'listboxId';
    var horizontalScrollBar = $('#listboxId').find(horizontalScrollBarId);
    // Horizontal scrollbar is visible
    if (horizontalScrollBar.css('visibility') === 'visible') {
        horizontalScrollBar.css('visibility', 'hidden');
        $('#listboxId').css('height', $('#listboxId').height() - 20);
    }

    My mistake.

    • This reply was modified 7 years, 10 months ago by  npayot.
    Disable horizontal scrollbar? #100646

    kazoooka
    Participant

    What you posted npayot does work for a millisecond. As soon as (i’m debugging the code) i’m after the
    $(‘#listboxId’).css(‘height’, $(‘#listboxId’).height() – 20);
    the listbox resets somehow and displays the scrollbar again magically. How can i achieve removing the scrollbar completely? I don’t want the text to wrap with setting autoItemsHeight: true… Please anybody? I can’t find an answer to this anywhere…

    Disable horizontal scrollbar? #100670

    kazoooka
    Participant

    Anybody in this forum can help me please?

    Disable horizontal scrollbar? #100676

    Hristo
    Participant

    Hello kazoooka,

    Please, take a look at this forum post:
    https://www.jqwidgets.com/community/topic/disable-horizontal-scrollbar/#post-45475
    You could use the autoItemsHeight: true property and in this way, you will avoid horizontal scrollbar.

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.