Reload the Page After Ajax Success

Reload the page after ajax success

BrixenDK is right.

.ajaxStop() callback executed when all ajax call completed. This is a best place to put your handler.

$(document).ajaxStop(function(){
    window.location.reload();
});

Jquery refresh the page after success

The next statement wont execute unless you click Ok on alert().
So use console.log(data) instead.

success : function(data) {
                console.log(data);
                window.location.href=window.location.href;
            }

Reloading the current page after successful Ajax call

success:function(data) {
    location.reload();
},

reload div after ajax request

You can load the div like this.Please mind the space before divid (" #divid");

if (data.success){
   $("#divid").load(" #divid");
    }

jQuery location.reload to happen after ajax success

You need to add hash before reload and check the hash on load function for link, if it is match than trigger the click event,

$(document).ready(function(){
    if(window.location.hash == '#link'){
          $('toggle-arrow').trigger('click');
    }
})

$.ajax({
        url: updatedUrl,
        dataType: 'json',
        type: 'post',
        data: 'id=' +  id,
        complete: function() {},
        success: function(data) {
            $('.overlay').hide();
            alert(data.status+': '+data.message);
            window.location.hash = 'link';
            location.reload();            

        },
        error: function(xhr, ajaxOptions, thrownError) {
            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
        }
});

NO refresh the page when success ajax

Add back that e.preventDefault() to prevent the form submission, and in the error case, call location.reload(). (Or if you want to submit the form conventionally in the error case, use e.target.submit(); instead. Since that's calling submit on the DOM element [not a jQuery wrapper], it won't call your submit handler again. [This is one of the differences between programmatically calling submit on a DOM element vs. calling it on a jQuery object.])

How to prevent page from refreshing after ajax submit

Calling $("#form").submit(function() { ... }) creates a handler for the next time the form is submitted. Doing this inside the handler for $("#submit").click() is not correct. Clicking the submit button will establish a handler for the next submission, but then the default action will submit the form immediately, which refreshes the page. Putting e.preventDefault() inside the click handlers would prevent the reload, but then you would have to click twice to submit the form (and this wouldn't actually work, because the default action of a submit button is to trigger the submit event, and you're preventing that).

Just create submit handlers for each form, without doing it inside a click handler.

$(document).ready(function() {
  loadNewCourse();
  loadDelTable();
  $('#form').submit(function(e) {
    e.preventDefault();
    var in_arr = [],
      name = ("<?php echo $_SESSION['name']?>"),
      email = ("<?php echo $_SESSION['email']?>"),
      regno = ("<?php echo $_SESSION['regno']?>"),
      level = ("<?php echo $_SESSION['level']?>"),
      dept = ("<?php echo $_SESSION['dept']?>"),
      semester = ("<?php echo $_SESSION['semester']?>");
    $('.inChk').each(function(i) {
      var checked = $(this).is(':checked');
      if (checked) {
        in_arr.push($(this).val());
      }
    });
    $.ajax({
      url: 'submit.php',
      type: 'POST',
      cache: false,
      async: false,
      data: {
        post_inId: in_arr,
        name: name,
        email: email,
        regno: regno,
        level: level,
        dept: dept,
        semester: semester
      },
      success: function(data) {
        loadNewCourse();
        loadDelTable();
        // setTimeout(function(){
        //     $('#regModal').modal('hide');
        // }, 1000);
        $('body').removeAttr('style');
        $('#regModal').removeAttr('style');
        $('.modal-backdrop').remove();
        swal({
          // "Success", "Registration successful", "success"
          position: "top-end",
          type: "success",
          title: "Registration successful",
          showConfirmButton: false,
          timer: 2000
        })
      },
      error: function(data) {
        swal("Oops...", "Registration failed.", "error");
      }
    });
  });

  ////////////////////////////////////////////////////////////////////////////////////////
  // PROCESS AJAX DELETE ON CHECKBOX SELECT
  $('#delform').submit(function(e) {
    e.preventDefault();
    var id_arr = [],
      regno = ("<?php echo $_SESSION['regno']?>"),
      level = ("<?php echo $_SESSION['level']?>");
    $('.delChk').each(function(i) {
      var checked = $(this).is(':checked');
      if (checked) {
        id_arr.push($(this).val());
      }
    });
    swal({
        title: "Are you sure you want to delete selected courses?",
        text: "You can add these courses by registering again!",
        type: "warning",
        showCancelButton: true,
        confirmButtonText: "Yes, delete!",
        confirmButtonClass: 'btn btn-success',
        cancelButtonClass: 'btn btn-danger',
        closeOnConfirm: false
      },
      function(isConfirm) {
        if (isConfirm) {
          $.ajax({
            type: "POST",
            url: "submit.php",
            data: {
              post_id: id_arr,
              regno: regno,
              level: level
            },
            cache: false,
            async: false,
            success: function(data) {
              // console.log(data);
              loadDelTable();
              loadNewCourse();
              swal({
                // "Success", "Registration successful", "success"
                position: "top-end",
                type: "success",
                title: "Delete successful",
                showConfirmButton: false,
                timer: 2000
              })
            },
            error: function(data) {
              swal("Oops...", "Delete failed.", "error");
            }
          });
        } else {
          // alert('isNotConfirm and is not success');
          swal("Oops...", "Delete failed", "error");
        }
      });
    return false;
    ///////////////////////////////////////////////////////////////////////////////////////////
  });

  function loadNewCourse() {
    $.ajax({
      url: 'processReg.php',
      type: 'POST',
      cache: false,
      async: false,
      data: {
        loadit: 1
      },
      success: function(disp) {
        $("#reveal").html(disp).show();
      }
    });
  }

  function loadDelTable() {
    $.ajax({
      url: 'delete_tbl.php',
      type: 'POST',
      cache: false,
      async: false,
      data: {
        loadDel: 1
      },
      success: function(deldisp) {
        $("#showRegtbl").html(deldisp).show();
      }
    });
  }
});

If you had multiple submit buttons in the same form you would instead assign click handlers to each button, but not create submit handlers for the form.

---

Related Topics