Question

我想在提交表单时显示通知模式。但不幸的是，模式没有弹出这里是代码

＆＃13;

$("#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;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 1

您可以删除

location.reload();

在Ajax成功方法中避免阻止弹出窗口显示的页面重新加载。

也可以添加

e.preventDefault();

在按钮单击事件中，以防止表单提交导致重新加载，这也可能阻碍弹出窗口显示。并且您需要将e作为参数添加到事件中。

＆＃13;

$("#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;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 2

您需要阻止提交按钮的默认操作。使用preventDefault()。
在此处阅读：https://api.jquery.com/event.preventdefault/

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

没有显示模态

2 个答案: