Grid Loader doesn't hide after request finished

I had today the problem, that the loader doesn't hide after a a ajax response is loaded:

My problem is the following error:

"TypeError: Cannot read property 'down' of null
    at Object.bindFieldsChange (http://demo.dev/js/mage/adminhtml/grid.js:280:63)
    at Object.initGrid (http://demo.dev/js/mage/adminhtml/grid.js:80:14)
    at Object.initGridAjax (http://demo.dev/js/mage/adminhtml/grid.js:93:14)
    at http://demo.dev/js/prototype/prototype.js:391:23
    at klass.respondToReadyState (http://demo.dev/js/mage/adminhtml/loader.js:95:68)
    at klass.onStateChange (http://demo.dev/js/prototype/prototype.js:1545:12)
    at XMLHttpRequest.<anonymous> (http://demo.dev/js/prototype/prototype.js:391:23)"

We can't see the error, because magento is catching it and doesn't show it to us.

For debugging purposes we can change the js/mage/adminhtml/grid.js to add this:

    // line 174
    onException: function (response, exception) {
        console.log(response);
        console.log(exception);
    },

so it looks afterwards like this:

reload : function(url){
    if (!this.reloadParams) {
        this.reloadParams = {form_key: FORM_KEY};
    }
    else {
        this.reloadParams.form_key = FORM_KEY;
    }
    url = url || this.url;
    if(this.useAjax){
        new Ajax.Request(url + (url.match(new RegExp('\\?')) ? '&ajax=true' : '?ajax=true' ), {
            loaderArea: this.containerId,
            parameters: this.reloadParams || {},
            evalScripts: true,
            onException: function (a,b,c,d,e) {
                console.log(e);
            },

Solution

In my case the problem is a missing ID on the grid

class My_Module_Block_Adminhtml_Tab_Grid
    extends Mage_Adminhtml_Block_Widget_Grid
    implements Mage_Adminhtml_Block_Widget_Tab_Interface
{
    public function __construct()
    {
        parent::__construct();
        $this->setId('transactionMailFilesGrid'); // <-- this was missing