Loading Image

[walker1234Participant]

I have the following things defined in my code:

$(“#grid”).jqxGrid(‘showloadelement’);

$(“#grid”).on(‘bindingComplete’, function (event) {
alert(“Binding is completed”);
});

// Initialize the JQX grid object.
var grid = $(“#grid”).jqxGrid({

altrows: true,
autoshowloadelement: true,
showdefaultloadelement: true,
pageable: true,
autoheight: true,
showtoolbar: true,
theme: ‘classic’,

columnsresize: true,
columns: [

I can see this alert alert("Binding is completed"); but the icon isn’t loading using the $("#grid").jqxGrid('showloadelement'). I was looking at this fiddle for reference : http://jsfiddle.net/jqwidgets/g7zEL/

What am I missing?

[walker1234Participant]

I got the above working but I am wondering if there is anyway I could use a loading image instead of the default jqxwidget one?

[HristoParticipant]

Hello walker1234,

You could add jqxLoader and set there the desired image via html property.
Please, take a look at this demo.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[walker1234Participant]

Okay, thanks. Is it possible where I could just have an image with loading icon. I mean if I don’t want to have the image inside the predefined width and height frame?

[walker1234Participant]

Because, I tried using this in the Javascript code and I was still seeing the rectangular frame :

$(document).ready(function () {
    $('#jqxLoader').jqxLoader({  html: '<div style="padding: 10px;"><img src="https://i.stack.imgur.com/g75To.gif" alt="Loading Icon" height="150" width="150"></div>' });

    $('#openLoader').jqxButton({ theme: 'energyblue' });
    $('#openLoader').click(function () {
        $('#jqxLoader').jqxLoader('open');
    });
});

[HristoParticipant]

Hello walker1234,

Please, try to with this style setting:

.jqx-loader {
  border: none;
}

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts