web-dev-qa-db-ja.com

Sweetalert2Ajax-入力データの投稿

最近、プロジェクトでSweetAlert2を使用していますが、「メモの追加」機能をまとめたいと思います。

ユーザーがボタンをクリックすると、ページに移動し、以下が実行されます。

    <script>swal({
      title: "Add Note",
      input: "textarea",
      showCancelButton: true,
      confirmButtonColor: "#1FAB45",
      confirmButtonText: "Save",
      cancelButtonText: "Cancel",
      buttonsStyling: true
    }).then(function () {
      swal(
        "Sccess!",
        "Your note has been saved!",
        "success"
      )
    }, function (dismiss) {
      if (dismiss === "cancel") {
        swal(
          "Cancelled",
"Canceled Note",
          "error"
        )
      }
    })</script>

私が達成しようとしていて、苦労したのは、ajaxを使用して入力フィールド「textarea」からデータを投稿することです。

また、以下を使用して、送信が成功または失敗したことを確認したいと思います。

'成功'

swal(
        "Sccess!",
        "Your note has been saved!",
        "success"
      )

「失敗しました」

swal(
          "Internal Error",
          "Oops, your note was not saved."
          "error"
        )

また、PHPオブジェクトをajax(一意の顧客IDキー)に渡し、ajaxがデータを保存できるようにする必要があります。

<?php $CustomerKey; ?>

Sweet Alertは、ajaxの利用方法に関するドキュメントをあまり提供しておらず、stackoverflowやオンライン検索に関する私の問題に関する詳細情報を見つけるのに苦労していました。

どんな助けでも大歓迎です。

JSFiddleの例;

https://jsfiddle.net/px0e3Lct/1/

4
lzoesch

こんにちは、あなたがする必要があるのは、sweetalertのthen関数でajax呼び出しを行い、ajaxのデータパラメーターを使用して顧客キー変数をPOST変数として渡すことです。

var CustomerKey = 1234;//your customer key value.
swal({
    title: "Add Note",
    input: "textarea",
    showCancelButton: true,
    confirmButtonColor: "#1FAB45",
    confirmButtonText: "Save",
    cancelButtonText: "Cancel",
    buttonsStyling: true
}).then(function () {       
    $.ajax({
        type: "POST",
        url: "YourPhpFile.php",
        data: { 'CustomerKey': CustomerKey},
        cache: false,
        success: function(response) {
            swal(
            "Sccess!",
            "Your note has been saved!",
            "success"
            )
        },
        failure: function (response) {
            swal(
            "Internal Error",
            "Oops, your note was not saved.", // had a missing comma
            "error"
            )
        }
    });
}, 
function (dismiss) {
  if (dismiss === "cancel") {
    swal(
      "Cancelled",
        "Canceled Note",
      "error"
    )
  }
})

そして、phpファイルでcustomerKey値を取得するには、

$CustomerKey = $_POST['CustomerKey '];

幸運を

4
Hayden Passmore