Search code examples
javascripthtmlajaxprototypejs

Refresh specific div after AJAX UPDATER with prototype js


I want to update a specific div with id=message-board after an action takes place, and everything works fine and it is executed properly. The problem is that I want to refresh the div with the new results. In my case the div is closed after complete and I need to refresh my page in order to have what I except. Thank you. Following is the code sample.

  remove:function(mid){           
        var l_sParams = 'message_id='+mid;
        var l_sURL = '/ajax/caller/delete_message_board';           
        new Ajax.Updater('message-board',l_sURL,{parameters: l_sParams, method:'POST',
                         onComplete:function(a_oRequest){
                            // maybe here is requested code to refresh the div              
                         }.bind(this)
        });
    }   

Solution

  • So I think you need to use Ajax.Request instead of Ajax.Updater. Ajax.Updater is designed to simply update the content of a container with the response of an Ajax call. If you want to do more with an ajax request use Ajax.Request like this

    remove:function(mid){           
        var l_sParams = 'message_id='+mid;
        var l_sURL = '/ajax/caller/delete_message_board';           
        new Ajax.Request(l_sURL,{parameters: l_sParams, method:'POST',
                    onComplete:function(a_oRequest){
                         $('message-board').update(a_oRequest.responseText);
                         // Or if the results are JSON
                         $('message-board').update(a_oRequest.responseJSON.message);
                         $('message-board').show(); //if the div is hidden
                         // maybe here is requested code to refresh the div              
                     }.bind(this)
        });
    }