Подтверждение ввода Sweetalert2 с помощью AJAX - PullRequest
Новая
       9

Подтверждение ввода Sweetalert2 с помощью AJAX

0 голосов
/ 04 ноября 2018

Я использую sweetalert2 для настройки нескольких входов как модальных (с swal mixin), и мне нужно проверить на стороне сервера, равны ли отправленные значения значениям в базе данных. В качестве примера я использую только постоянное значение в файле .php. Вот мой код: 

{
  onBeforeOpen: function (dom) {
    dom.getElementsByClassName('swal2-input')[0].style = "display: none";
  },

  html:
    "<form action='' method='post'>" + 
      "<div class='main-cont'>"+
        "<span>" +
          "Por favor ingresa el codigo de verificacion NUIP "+
          "que hemos enviado a tu celular" +
        "</span>"+

        "<div class='row cuadros'>" +
          "<input id='num-1' class='inp-num' data-pos='0' type='text' maxlength='1' name='one' onkeypress='isInputNumber(event)' autofocus='autofocus'/>" +
          "<input id='num-2' class='inp-num' data-pos='1' type='text' maxlength='1' name='two' onkeypress='isInputNumber(event)'>" +
          "<input id='num-3' class='inp-num' data-pos='2' type='text' maxlength='1' name='three' onkeypress='isInputNumber(event)'>" +
          "<input id='num-4' class='inp-num' data-pos='3' type='text' maxlength='1' name='four' onkeypress='isInputNumber(event)'>" +
        "</div>" +
      "</div>"+
    "</form>",

  inputValidator: function() {
    var nums = Object.values(document.getElementsByClassName("inp-num"));

    for(var i = 0; i < nums.length; i++) {
      if(!nums[i].value) {
        return 'Ingresa el codigo completo';
      }
    }

    $.ajax({
      type:  "POST",
      url:   "php/confirma_datos.php",
      data: {
        "one":    $("#num-1").val(),
        "two":    $("#num-2").val(),
        "three":  $("#num-3").val(),
        "four":   $("#num-4").val(),
      },      
      success     :   function(response) {
        if (response == 'true') {
          swal('hola');
          return 'OK';
        } else {
          console.log('no coinciden');
        }
      },
    });
  },

  preConfirm: function () {
    return [
      $("#num-1").val(),
      $("#num-2").val(),
      $("#num-3").val(),
      $("#num-4").val(),
    ]
  },
},

А на стороне сервера у меня. 

    <?php
  $nuip_comp = "1234";

  $nuip = $_POST['one'] . "" . $_POST['two'] . "" . $_POST['three']. "" . $_POST['four'] ;

  if($nuip_comp == $nuip) {
    echo 'true';
  } else {
    echo 'false';
  }

Я хочу помешать модальному переходу на следующий шаг, пока значения не станут равными. Есть идеи, как это сделать?

Спасибо!

...