How to display the datatable with loading symbol using JQuery

Question

I need to display the data table with a loading symbol.

I have more than 10,000 records. I need to display this records in data table. This is the code to display the record in data table ,

$('#example').dataTable({
         "oLanguage": {
            "sProcessing": "loading......"
        }
    });

I have more than 10,000 records so that the data table displays a few seconds late. As a result I need to display the loading symbol. How can I achieve this?

possible duplicate of [jQuery "Please Wait, Loading..." animation?](http://stackoverflow.com/questions/1964839/jquery-please-wait-loading-animation) — Vladimir Ramik, Mar 12 '15 at 06:14

score 0 · Answer 1 · answered Mar 12 '15 at 06:30

0

You must use Ajax (here is the example: http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_suggest_php )

The loading symbol you can get by jQuery Lazy ( http://plugins.jquery.com/lazy/ )

answered Mar 12 '15 at 06:30

Mego

154
1
3
10

score 0 · Answer 2 · answered Mar 12 '15 at 06:48

0

If you want to replace "loading......" string with an image

$('#example').dataTable( {
        "oLanguage": {
            "sProcessing": "<img src='loading.gif'>"
        }
    } );

answered Mar 12 '15 at 06:48

Umair Ahmed

3
4

ok tell me error plz ? Do u correctly insert the path of loading image ? – Umair Ahmed Mar 12 '15 at 08:28
DataTable is undefined – soniya soniya Mar 12 '15 at 10:44
$('#example').dataTable( { "oLanguage": { "sProcessing": "" } } ); – soniya soniya Mar 12 '15 at 10:48
Can u please show me your Html as well if possible show me in jsfiddle.net – Umair Ahmed Mar 12 '15 at 11:29
There is no gif file present over there http://eurocopter.in/contest/images/loader33.gif . Please check DataTable spelling as well . Thanks – Umair Ahmed Mar 12 '15 at 11:46

score 0 · Answer 3 · answered Mar 13 '15 at 06:31

0

Please try this.

In Jquery :-

    $(document).ready(function() {

    $('#example').dataTable({
    });
     $('#example').show();

    });

In Html :-
 <table id="example" class="display" cellspacing="0" width="100%" style="display:none">

answered Mar 13 '15 at 06:31

soniya soniya

297
2
3
14

How to display the datatable with loading symbol using JQuery

3 Answers3