Not showing the Modal - php

Question

I want to show a notification modal when i submit a form.but unfortunately the modal is not popping up here is the code
$("#submitmodalRetailer").submit(function() {
var FirstName = $('#FirstNameRetailer').val();
var LastName = $('#LastNameRetailer').val();
var QRCodeRetailer = $('#QRCodeRetailer').val();
var prefixNumberRetailers = $('#prefixNumberRetailer').val();
var Retailer7Digits = $('#Retailer7Digit').val();
$.ajax({
type: "POST",
url: "addRetailer.php",
data: $('form.form-modal-retailer').serialize(),
success: function(msg) {
$("#RetailerAdd").modal('hide');
location.reload();
if (msg == 'Valid') {
$("#RetailerAddshow").modal('show');
} else if (msg == 'AlreadyExists') {
$("#BarcodeExists").modal();
} else if (msg == 'Invalid') {
alert('Your Barcode number is invalid. \n User only 100001 to 199999')
}
},
error: function() {
alert("failure");
}
});
return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

You may remove
location.reload();
in Ajax success method to avoid page reload that hinder popup from showing up.
and also you can add
e.preventDefault();
in the button click event to prevent the form submit to cause reloading that may also hinder popup from showing.
and you need to add e as a parameter to event.
$("#submitmodalRetailer").submit(function(e) {.
e.preventDefault();
var FirstName = $('#FirstNameRetailer').val();
var LastName = $('#LastNameRetailer').val();
var QRCodeRetailer = $('#QRCodeRetailer').val();
var prefixNumberRetailers = $('#prefixNumberRetailer').val();
var Retailer7Digits = $('#Retailer7Digit').val();
$.ajax({
type: "POST",
url: "addRetailer.php",
data: $('form.form-modal-retailer').serialize(),
success: function(msg) {
$("#RetailerAdd").modal('hide');
// location.reload();
if (msg == 'Valid') {
$("#RetailerAddshow").modal('show');
} else if (msg == 'AlreadyExists') {
$("#BarcodeExists").modal();
} else if (msg == 'Invalid') {
alert('Your Barcode number is invalid. \n User only 100001 to 199999')
}
},
error: function() {
alert("failure");
}
});
return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

You need to prevent the default action of the submit button.
Use preventDefault().
Read about it here: https://api.jquery.com/event.preventdefault/
$("#submitmodalRetailer").submit(function (e) {
e.preventDefault();
});