javascript – jQueryFade Out On Page Reload

I wonder whether someone can help me please.

The extract of script below enables a user to delete records from a table, linked to a mySQL database.

<script type=\"text/javascript\">
    $(document).ready(function(){
        $(\'form.delete\').submit(function(e){ 

            e.preventDefault();
            var elem = $(this).closest(\'.delete\');
            var lid = $(this).serialize();
            $.confirm({
                 \'title\'    : \'Delete Confirmation\',
            \'message\'   : \'If you delete this Location, all associated Find records will also be deleted. <br /><br />They cannot be restored at a later time! Do you wish to continue?\',
                \'buttons\'   : {
                    \'Yes\'   : {
                \'class\' : \'blue\',
                \'action\': function(){
                //elem.slideUp();
                              $.ajax({ 
                            url: \'deletelocation.php\', 
                            type: \'POST\', 
                            data: lid, 
                            success: function(response) { 
                            console.log(\'success\', response); 
                                    setTimeout(function() { 
                                    $(\'body\').fadeOut(400, function(){
                                    location.reload();
                                    setTimeout(function(){
                                    $(\'body\').fadeIn(400);
                                     }, 500);
                                     window.scrollTo(x-coord, y-coord);
                                 });
                            }, 2000);
                            }, 
                            error: function() { 
                            console.log(\'error\') 
                            } 
                            }); 
                    }
                },
                \'No\'    : {
                    \'class\' : \'gray\',
                                        \'action\': function(){}  // Nothing to do in this case. You can as well omit the action property.

                }
            }
        });

    });

    })
</script> 

I can manage to get the \’Delete Confirmation\’ message working and the actual deletion of the record, but I\’m having a little difficulty in adding a \’Fade out\’ as the deletion takes place and then a \’Fade in\’ upon page reload.

I\’ve read a number of posts and from these I came up with the following which I\’ve integrated into the above :

setTimeout(function() { 
$(\'body\').fadeOut(400, function(){
location.reload();
setTimeout(function(){
$(\'body\').fadeIn(400);
}, 500);
window.scrollTo(x-coord, y-coord);
});
}, 2000);

However this doesn\’t work, and I\’m not sure why. I just wondered where someone may be able to take a look at this please and let me know where I\’m going wrong.

Many thanks and kind regards

Rating: 3 out of 5 based on 3 ratings

Posts Related to javascript - jQueryFade Out On Page Reload

• 
  
  
  

  regex – lookbehind in javascript?

  
  

  I wanted to use regex to match and replace anything between my file name and closing parentheses. I wrote a regex: /(?<=imagecheck.php)[^)]*/ That works in ...

  
  
  
  


• 
  
  
  

  jquery – Post to PHP, do not reload page and update div

  
  

  EDIT: This works now, code updated. Big thanks to Martin Amps! So I\'ve been playing with this for a week now and have hacked together ...

  
  
  
  


• 
  
  
  

  Smooth Transitions between div tags on click in CSS or Javascript in a single HTML Page

  
  

  I have a problem in implementing smooth navigation between different div tags on a single page. Say I have a page with 5 different tags ...

  
  
  
  


• 
  
  
  

  php – How can I refresh a page/frame when a server not found error page is displayed?

  
  

  I\'ve searched but haven\'t been able to find any discussion on this topic: I have a private webpage (implemented in php) that scrolls through a ...

  
  
  
  


• 
  
  
  

  Using Javascript, how can I change the CSS display property on a different HTML page

  
  

  So, I want to change the display style of one of my divs, here\'s the code in my javascript: document.getElementById(\"header1\").style.display=\'none\'; Now the problem... header1 is ...

  
  
  
  


• 
  
  
  

  javascript alert and update page asp.net c#

  
  

  I am writing asp.net project in C#. I have a button in a page default.aspx, and I need javascript alert when I click the button ...

  
  
  
  


• 
  
  
  

  javascript – set cursor in login form field on page load

  
  

  I\'m trying to get my cursor to load in my login form field on page load. So i\'m using this code that supposedly works in ...

  
  
  
  


• 
  
  
  

  jquery – Call a Jsp page in javascript function

  
  

  I want to call a jsp page with in the javascript function without using this code <form method=\"post\" action=\"createxml.jsp\"> I use the call like this ...

  
  
  
  


• 
  
  
  

  Remove class using javascript

  
  

  I need to remove the specific class attribute from all the element in the page. That is we need to remove the particular class from ...

  
  
  
  


• 
  
  
  

  mysql – Ajax Form submit recieving in PHP

  
  

  I am experiencing some issues with a form I am making. I have the code to post a form to my PHP script that is ...

  
  
  
  

The post javascript – jQueryFade Out On Page Reload appeared first on Javascript ASK.

via Javascript ASK http://javascriptask.phpfogapp.com/javascript-jqueryfade-out-on-page-reload.html