2017-12-09 18 views
0

私はSweetAlert2を使用しています。ユーザーがResetボタンをクリックすると、確認のためにSweetAlertのpopUpが表示されます。私はすでにこれをしていた。
HTMLsweetalert2でフォームをリセットするには

<form id="storyForm" action="ephp/storyPublish.php" method="POST"> 
<input type="text" name="userName" /> 
<input type="Email" name="userEmail" /> 
<button type="submit">Publish</button> 
<button type="reset" class="model_img" id="sa-warning">Reset</button> 
</form> 

JS

$("#storyForm").on('reset', function(e) { 
    var form = $(this); 
    e.preventDefault(); 
    swal({ 
     title: "Are you sure?", 
     text: "Do you really want to reset?", 
     type: "warning", 
     showCancelButton: true, 
     confirmButtonColor: '#DD6B55', 
     confirmButtonText: 'Go on!', 
     cancelButtonText: "Ops no!", 
    }).then(function(isConfirm) { 
     swal({ 
      title: 'Success!', 
      text: 'Invoice created! Go to the invoice tab to pay it.', 
      type: 'success' 
     }, function() { 
      form.reset(); 
     }); 
    },function(dismiss) { 
     if(dismiss == 'cancel') { 
      swal("Cancelled", "Invoice not created!", "error"); 
     } 
    }); 
}); 

ポップアップが表示されているが、フォームがresetingされていない、このJavaScriptを使用して間違って何ですか?ここ
Fiddle

答えて

0

こんにちは私はリセットするために、フォームを得ることができたが、あなたのform.reset()関数を使用していない、私は入力のIDを与えることによって、それが仕事を得ることができたし、その後の取り扱いでありますsweetalertsの結果を使用してリセットします。

HTML

<form id="storyForm" action="ephp/storyPublish.php" method="POST"> 
<input type="text" name="userName" id="userName" /> <!--added the id here--> 
<input type="Email" name="userEmail" id="userEmail" /> <!--added the id here--> 
<button type="submit">Publish</button> 
<button type="reset" class="model_img" id="sa-warning">Reset</button> 
</form> 

はJavaScript

$("#storyForm").on('reset', function(e) { 
    var form = $(this); 
    e.preventDefault(); 
    swal({ 
     title: "Are you sure?", 
     text: "Do you really want to reset?", 
     type: "warning", 
     showCancelButton: true, 
     confirmButtonColor: '#DD6B55', 
     confirmButtonText: 'Go on!', 
     cancelButtonText: "Ops no!", 
    }).then((result) => { 
     if (result.value) { 
      $("#userName").val(""); 
      $("#userEmail").val(""); 
      swal(
      'Reset!', 
      'Your form has been reset.', 
      'success' 
     ) 
      /*swal({ 
      title: 'Success!', 
      text: 'Invoice created! Go to the invoice tab to pay it.', 
      type: 'success' 
      });*/ 
      // result.dismiss can be 'cancel', 'overlay', 
      } else if (result.dismiss === 'cancel') { 
      swal("Cancelled", "Invoice not created!", "error"); 
     } 
     }); 
}); 

NOTE - それは請求書を追加していなかったとして、私はあなたの成功のSwaIからのコメントがありますが、それはこれだけアンコメントそれを行うと、削除したい場合それ以上の甘い御馳走。

はここでjsFiddle

私は、これは幸運に役立ちます願っています!

関連する問題