jQuery UI Widgets Forums Lists ComboBox Loading image when loading huge data

This topic contains 7 replies, has 3 voices, and was last updated by  frankbur1 7 years, 3 months ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • Loading image when loading huge data #56084

    krnacm
    Participant

    Hi guys,

    I wonder if it is possible to show some loading image (e.g turn wheel) when combobox is loading huge amount of data and it looks like it is nothing doing.

    Thanks,

    Kind regards,
    Matej

    Loading image when loading huge data #56095

    Dimitar
    Participant

    Hello Matej,

    How about this: add the following style to your page:

    <style type="text/css">
        .jqx-combobox-input, .jqx-combobox-content
        {
            background: url('../../images/loader.gif') no-repeat center;
        }
    </style>

    Remove the background image on the bindingComplete event:

    $("#jqxComboBox").on('bindingComplete', function (event) {
        $(".jqx-combobox-input, .jqx-combobox-content").css({ "background-image": "none" });
    });

    Best Regards,
    Dimitar

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

    Loading image when loading huge data #56138

    krnacm
    Participant

    Hi Dimitar,

    thanks for your suggestion, but it is not working correctly. It set the loading icon image to the combobox always, but I need to only when the data is loading data. Maybe another css class needs to be use instead of .jqx-combobox-input, .jqx-combobox-content which is set only when the data are loaded, but I guess there is not some king of this class. I checked the CSS Styling for combobox and I didn’t find something similar.

    Maybe a solution can be to set the background image in some event befor the data begin to load and in bindigComplete event remove the image. Is there some kind of event before the data are loaded?

    Thanks,

    Kind regards,
    Matej

    Loading image when loading huge data #56142

    Dimitar
    Participant

    Hi Matej,

    The loading image does not display always, only until the bindigComplete event fires. This means it will show only during data loading. Please make sure you bind to the event before the combobox initialization, as shown in this fiddle: http://jsfiddle.net/jqwidgets/UKG2p/.

    Best Regards,
    Dimitar

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

    Loading image when loading huge data #56147

    krnacm
    Participant

    Hi Dimitar,

    I have get it to work, thanks.

    Kind regards,
    Matej

    Loading image when loading huge data #90308

    frankbur1
    Participant

    hi dimitar,

    works fine, but what would be to do, if i have 4 comboboxes?
    when i say: $(“.jqx-combobox-input, .jqx-combobox-content”).css({ “background-image”: “none” });
    on all comboboxes the loading image is away.
    i found no way to set an id on the comboboxes, is there a way?

    how could i handle this?

    kindest regards, frank

    Loading image when loading huge data #90342

    Dimitar
    Participant

    Hi Frank,

    In most of our examples (including the above), an id is assigned to the combobox, i.e. <div id='jqxComboBox'></div>. You can use CSS selections such as #jqxComboBox .jqx-combobox-input to target the input of only a specific combobox.

    Best Regards,
    Dimitar

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

    Loading image when loading huge data #90355

    frankbur1
    Participant

    hi dimitar,

    works fine.

    THX, kindest regrads, frank

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

You must be logged in to reply to this topic.