How to grey out datatable(overlay) on sProcessing

How to grey out datatable(overlay) on sProcessing

MayurPMayurP Posts: 23Questions: 4Answers: 0
edited March 2014 in General
Hi all,

I'm showing processing icon (loader) on ajax call by using below code,

[code]$('#blViewTab_processing').css("visibility","visible");[/code]

But I also wanted to grey out whole datatable when process is going on.

Please let me know how to achieve this?

Thanks in advance.

Replies

  • xilaxxilax Posts: 10Questions: 0Answers: 0
    Do this instead:

    set "bProcessing" to true as in
    [code] "bProcessing": true, [/code]

    and
    [code]
    "oLanguage": {
    "sProcessing": "Loading, please wait..."
    }
    [/code]
  • xilaxxilax Posts: 10Questions: 0Answers: 0
    Then style your sProcessing css

    e.g
    [code]
    table.dataTable td.dataTables_empty{text-align:center}
    .dataTables_processing{position:absolute; top:50%; left:50%; width:250px; min-height:30px; margin-left:-125px; margin-top:10px; padding:10px 0 10px 0; border:1px solid #ddd; text-align:center; color:#999; font-size:14px; background-color:white; z-index:100}
    [/code]
  • MayurPMayurP Posts: 23Questions: 4Answers: 0
    Hi xilax,

    I've already tried the same but when i'm calling ajax url at that time,

    I want to grey out complete datatable(overlay) so that user will not able to update/search/filter any data from UI Screen.

    Thanks.
  • xilaxxilax Posts: 10Questions: 0Answers: 0
    Then make use of blockUI(). Check out http://malsup.com/jquery/block/
  • xilaxxilax Posts: 10Questions: 0Answers: 0
    For quick implementation,(to save you time)

    [code]
    doBlockUI : function(domElement, loadMsg){
    if(loadMsg == null)
    loadMsg = '';
    var el = $(domElement);
    el.block({
    overlayCSS: {
    backgroundColor: '#f2f2f2'
    },
    message: loadMsg,
    css: {
    border: 'none',
    color: '#333',
    background: 'none'
    }
    });
    },
    [/code]

    I copied it out of my jquery extention; just tweak to your need.
    So you can call $.doBlockUI("#elementIDorByNameorSomething");
  • MayurPMayurP Posts: 23Questions: 4Answers: 0
    Thanks xilax
This discussion has been closed.