0

I am using JQuery and the page acts like it refreshes but doesn't update my table. All my other JQuery commands using the location.reload(true); do a hard refresh. Using this AJAX version doesn't seem to do it. I plan on using the AJAX later to just update a div, but for now the whole page refresh is what I need.

JS

$(document).ready(function(){
    $('#import_audit').click(function(){
    //alert("Audit Deleted");
    $('#import_audit_div').modal('show'); //show modal with id="import_audit_div"

    $('#import_audit_table').load("edit_audits.php?action=import"); //Doesn't load from database until modal is loaded.
    });

    $(function() {
        $("#import_audit_form").submit(function(e) {
            e.preventDefault(); 

            // 'this' refers to this form element
            var data = $(this).serialize();

            $.ajax({
                type: "POST",
                url: "edit_audits.php?action=process_import",
                data: data,  
                success: function (data) {
                    alert("Audit Transfered");
                    //$('#import_audit_div').modal('hide');

                    location.reload(true);
                    //trying to reload only the div
                    //$("#Results1").load(location.href + " #Results1");

                }
            });  
        });  
    });
});
  • 2
    What's the code behind `edit_audits.php?action=process_import` doing? – Chay22 Jun 24 '16 at 14:57
  • 1
    You may want to try `window.location.reload` instead of `location.reload` in case the `location` global was overwritten somewhere. – Devon Bessemer Jun 24 '16 at 14:58
  • 1
    How about disabling the cache for that page? http://stackoverflow.com/questions/1341089/using-meta-tags-to-turn-off-caching-in-all-browsers – Fred Austere Jun 24 '16 at 14:59
  • 1
    Are you positive that the ajax ever fires in the first place? If it doesn't then it's success handler certainly wont. – TheZanke Jun 24 '16 at 15:00
  • 1
    I think that in this case `$(function() {` is redundant.. – Hackerman Jun 24 '16 at 15:03
  • Everything works and the page acts like it will refresh, but doesn't. Like a quick flicker of the screen. –  Jun 24 '16 at 15:11
  • The edit_audits post the code to update an audit. it is like using Action"edit_audits.php" for a form. –  Jun 24 '16 at 15:13
  • Can you turn off the cache through JQuery? –  Jun 24 '16 at 15:14
  • 1
    Post a screenshot of a Network tab in dev-tools of your browser. – wazelin Jun 24 '16 at 15:17
  • The window.location.reload seems like it refreshes the page, but it has to be the cache that is getting in the way –  Jun 24 '16 at 15:17
  • Which part of the network tab for inspect would be the important part to examine? –  Jun 24 '16 at 15:22
  • 1
    Are you getting a successful response code on your request? The success handler will not fire unless you get a code between 200-300 OR 304. – TheZanke Jun 24 '16 at 15:33
  • Everything says Status 200 and new elements are loaded –  Jun 24 '16 at 15:58
  • 1
    I also used the to see if that would help, and it did! –  Jun 24 '16 at 15:58
  • It works now for showing new rows to the table, but if I delete a row it doesn't update, but that is a different code I can post later –  Jun 24 '16 at 16:01

2 Answers2

0

You are missing a }); at the bottom. In your browser development tools does it show an error in your console? I don't think your javascript is actually working, which would mean that the location.reload(true) never fires.

TheZanke
  • 1,026
  • 8
  • 12
  • All the commands work, if a bracket was missing nothing works. I also used alerts to make sure things are working –  Jun 24 '16 at 15:08
  • I missed one bracket in this posting of code. I will update that. –  Jun 24 '16 at 15:10
0

I think its the ajax request itself that is cached. Try adding the cache setting.

$.ajax({
    type: "POST",
    url: "edit_audits.php?action=process_import",
    data: data,  
    cache : false,
    ...

There's some conflicting information on whether this has an effect, but it's worth trying.

cache (default: true, false for dataType 'script' and 'jsonp') Type: Boolean If set to false, it will force requested pages not to be cached by the browser. Note: Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters. The parameter is not needed for other types of requests, except in IE8 when a POST is made to a URL that has already been requested by a GET.

You could also try to globally disable the cache to see if that changes anything.

$.ajaxSetup({ cache: false });

Fred Austere
  • 11
  • 4