Используйте jquery для отправки формы с $ _POST ['id'] после модального подтверждения jquery - PullRequest
0 голосов
/ 10 июля 2019

Я посмотрел этот главный пост до того, как он был помечен как дубликат ( Подтверждение отправки формы с помощью всплывающего окна с пользовательской моделью ) - но у этого человека было несколько форм, а не несколько отправок в одной форме.Я могу получить форму для отправки, но только не так, чтобы она следовала правильному пути в php - в зависимости от того, какая кнопка была нажата

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

С помощью jquery я использовал очень простой скрипт для всплывающего подтверждения при отправке формы, который не сработал

$('#confirm').click(function() {
  if(!confirm('Are you sure you want to submit this form?')) {
    return false;
  }
});

Теперь я пытаюсь использовать jquery-подтверждение, чтобы получить модальности, выглядящие лучшено не могу заставить скрипт отправить форму после нажатия кнопки продолжения.Проблема в том, что разные кнопки отправки в форме - две имеют всплывающие окна (подтвердить и отменить), а предварительный просмотр просто сохраняет и перенаправляет.Форма должна отправляться (с установленным $ _POST ['verify']) только при нажатии кнопки продолжения в модальном режиме.

Я добавил идентификатор и значение для кнопки и попробовал с каждым из них

$('form').submit(); // form submits but not with $_POST['confirm'] set
$('form').submit('[name="confirm"]'); // button won't click
$('form').submit('#confirm'); // button won't click
$('input').submit('confirm'); // button won't click
$('#form #confirm').submit(); // modal closes, does nothing

Я пытался получить значение кнопки отправки, но я чувствую, что это довольно бессмысленно, поскольку я уже знаю значение и идентификатор кнопки, просто не знаю, как использовать это при отправке

var submitter = $(this).val() // get value of button

Я думал, что, возможно, ajax будет подходить, мог бы установить «подтверждение» как дополнительные данные, но я даже не могу заставить это работать полезным способом - либо он вообще не отправляет, либо отправляет раньшепоявляется модальное значение

$.ajax({
  type: 'POST',
  data: { confirm: 'true' }, // modal appears, click continue but data doesn't submit
  // data: { confirm: 'true' } // with no comma - submits without modal appearing
  // data:none // continue button won't click
  url: "jquery-confirm.php", // this is the file name
  success: function () {
    alert('form was submitted');
  }
});

Так что весь код вместе выглядит так:

<?php if(isset($_POST['confirm'])) {
  // check for errors
  // clean data and sent to db
  echo ‘form submitted’;
} ?>

<form method="post" name="editblog" role="form" id="form">
  <!— form contents - multiple fields including images —>
  <input type="submit" name="discard" value="discard" class="btn btn-outline-danger">
  <input type="submit" name="preview" value="preview" class="btn btn-outline-info">
  <input type="submit" name="confirm" value="confirm" class="btn btn-outline-success">
</form>

$('#confirm').on('click', function(e) {
  $.confirm({
    title: 'Please confirm',
    content: 'Are you sure you want to submit this?',
    icon: 'fas fa-exclamation-triangle',
    theme: 'material',
    closeIcon: true,
    animation: 'scale',
    type: 'orange',
    buttons: {
      proceed: {
        text: 'Continue',
        btnClass: 'btn-success',
        action: function() {
          // see above for all code tried here
        }
      },
      cancel: function () {
        // no action here - closes box
      },
    }
  });
  e.preventDefault();
});
...