Replace the default message “Loading ...” with the image “Loading.gif” in the JQGrid footer

Question

Experts

I have successfully implemented JQGrid with my project. My requirement: I would like to replace the default message "Loading ..." with the image "Loading.gif" in the jqgrid footer .

Can this be implemented?

I also added a screenshot for clarity.

Updated JQGrid HTML footer

Thanks,
Imdadhusen

Answer 1

First of all, I recommend that you read two old answers: this and.

To have a loading div that displays an animated gif and no text, you must change the style of the loading class, e.g.

<style type="text/css"> .ui-jqgrid .loading { background: url(loader1.gif); border-style: none; background-repeat: no-repeat; } </style> 

delete the default text “Loading ...” with $.jgrid.defaults.loadtext='' and move the “download” section to the place where you want to use it. You need to further customize some CSS styles. for instance

 $("#load_list") .css({position:'relative',left:'0',float:'left',width:'4px', height:'4px','margin-top':'3px'}) .prependTo('#pager_left'); 

In the end you will get something like

See the corresponding demo here .