web-dev-qa-db-ja.com

SweetAlert「キャンセル」ボタンをクリックした後のコードの呼び出し

私は次のコードを書きました、「キャンセル」ボタンの下でコードを呼び出したいです:

vm.saveGroup = function(){
    SweetAlert.swal({
        title: "Name this Device Group",
        text: "Please provide a name that you want your device group to be saved under. Also, make sure that you already specified all needed filters before you save the list.",
        type: "input",
        showCancelButton: true,
        closeOnConfirm: false,
        showLoaderOnConfirm: true,
        inputPlaceholder: "Device Group name"
    },
    function(inputValue){
        if (inputValue === false) {
            return false;
        }
        if (inputValue === "") {
            /*eslint-disable */
            swal.showInputError("You need to write something!");
            /*eslint-enable */
            return false;
        }

        deviceGroupsFactory.saveGroup(inputValue, vm.filterOutput)
            .then(function(response){
                if (response.status == 200){
                    SweetAlert.swal("Device Group saved!", "You should now see your device group on the list.", "success");
                    $state.go('main.template.devices.groups');
                }
                else {

                    SweetAlert.swal("Error!", response.statusText, "error");

                  console.log('xxx');
                }
            });
    });

}

「クリックをキャンセル」とは呼べません。ドキュメントで探していましたが、解決策が見つかりません。

5
Tomasz Waszczyk

swalコンストラクターに渡すパラメーターが多すぎます。必要なのは2つだけです。

swal(オプション、コールバック)

  • オプション:アラートを設計するための属性
  • コールバック:イベントを管理するためのコールバック関数

単純な確認を使用すると、コールバックはユーザーの選択を示すパラメーターを1つだけ受け取ります。

  • true:確認
  • false:キャンセル

Inputboxを使用すると、ユーザーの入力文字列をパラメーターとして受け取ります。

Inputboxをマージして確認すると、次のものを受け取ることができます。

  • 入力文字列値:ユーザーが確認を押したとき
  • false:ユーザーがキャンセルを押したとき

したがって、を使用する必要があります 厳密な等価比較ユーザーがキャンセルを押したか、文字列falseを挿入したかどうかを知るために入力ボックス。

次の簡単な例をご覧ください。

swal({
  title: "Are you sure?",
  text: "Press CANCEL, please!",
  type: "input",
  showCancelButton: true,
  confirmButtonColor: "#DD6B55",
  confirmButtonText: "CONFIRM",
  cancelButtonText: "CANCEL",
  closeOnConfirm: false,
  closeOnCancel: false
},
function(inputValue){
  //Use the "Strict Equality Comparison" to accept the user's input "false" as string)
  if (inputValue===false) {
    swal("Well done!");
    console.log("Do here everything you want");
  } else {
    swal("Oh no...","press CANCEL please!");
    console.log("The user says: ", inputValue);
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert-dev.min.js"></script>

さようなら、お役に立てば幸いです。

6
Alessandro

。thenを使用してpromiseの実装を使用することもできます

私はあなたに例を残します、これはボタンを押した直後に実行されます

swal( 'Error!',valido.msj,'error').then((e)=>{
  if( valido.msj=="Enlace de botón No Válido" ){
     document.getElementById('link_btn_barra').focus();
  } 
});
0
Julio Vinachi