2016-12-03 30 views
0

私はSweetAlert2で作業しようとしています。 $ _POSTでデータを送信したくないときに動作します。しかし、私が$ _POSTを通してデータを送信したい場合、sweetalertはちょうど1秒未満で現れ、それから、ユーザーの選択に関係なく、フォームは送信されます。Sweetalert2がtrue/falseを返さない

通常のウィンドウ確認をしたいときにコードを変更するにはどうしたらいいですか?ユーザーが「削除」をクリックするとフォームは送信されます。他の場合は「キャンセル」をクリックするとフォーム送信されませんか?初心者へ

if(isset($_POST['submit'])) { 
    echo 'Your form was submitted.'; 
} 

<form action="#" method="post>     
<label> 
    <span>Username</span> 
    <input type="text" value="" name="username" /> 
</label> 
<input type="submit" name="submit" value="Register!" id="test-1" />  
</label>  
</form> 



<script> 
document.querySelector('#test-1').onclick = function(){ 
    swal({ 
    title: 'Are you sure?', 
    text: "You won't be able to revert this!", 
    type: 'warning', 
    showCancelButton: true, 
    confirmButtonColor: '#3085d6', 
    cancelButtonColor: '#d33', 
    confirmButtonText: 'Yes, delete it!' 
    }).then(function() { 
    swal(
     'Deleted!', 
     'Your file has been deleted.', 
     'success' 
    ) 
    }) 

    //IF SWAL => DELETE -> send form 
    //ELSE IF SWAL => CANCEL -> do nothing 
    //when I put here "return false;", then sweetalert is working, but it doesn't send the form 
</script> 

ソリューションのおかげ:

<?php if(isset($_POST['send'])) 
{echo 'Your form was submitted.';} ?> 

<form id='myfrm' action="#" method="post"> 
<label> 
    <span>Username</span> 
    <input type="text" value="" name="username" /> 
    <input type="hidden" name="send" value="send"> 
</label> 
</form> 
<button value="Register!" id="test-1"> submit </button> 

<script> 
document.querySelector("#test-1").onclick = function(){ 
    swal({ 
    title: "Are you sure?", 
    text: "You won't be able to revert this!", 
    type: "warning", 
    showCancelButton: true, 
    confirmButtonColor: "#3085d6", 
    cancelButtonColor: "#d33", 
    confirmButtonText: "Yes, delete it!" 
    }).then(function() { 
    document.querySelector("#myfrm").submit();  
    }) 
}  
</script> 

答えて

1

のではなく、フォーム上のハンドラを使用することができますハンドラを使用して、より良い、そのよう

は、フォームにidも通常の状態にあなたのsubmitボタンを変更を与えます私たちはユーザーの選択に応じて手動で提出する(または提出しない)

<form id='myfrm' action="#" method="post"> <!-- u missed quote here -->    
<label> 
    <span>Username</span> 
    <input type="text" value="" name="username" /> 
</label> 
<!-- EDIT : removed (not working) 
<input type="button" name="submit" value="Register!" id="test-1" />  
--> 
<input type="hidden" name="submit" value="submit"/> 
</label>  
</form> 
<!-- EDIT : added --> 
<button name="submit" value="Register!" id="test-1"> submit </button> 



<script> 
document.querySelector('#test-1').onclick = function(){ 
    swal({ 
    title: 'Are you sure?', 
    text: "You won't be able to revert this!", 
    type: 'warning', 
    showCancelButton: true, 
    confirmButtonColor: '#3085d6', 
    cancelButtonColor: '#d33', 
    confirmButtonText: 'Yes, delete it!' 
    }).then(function() { 

    // swal('Ready?!', 'Your form is going to be submitted.' 'success'); 
    // if you want to show alert that form is going to submit you may un-comment above line 
    document.querySelector('#myfrm').submit(); // manully submit 
    }) 
+0

ありがとう、初心者!しかし、まだそれは動作しません(または、ちょうどその部分から - それは、削除したいのであれば、ユーザーにはうなずきますが、.then(function()の2番目の部分はうまくいきません):http://avcr1.chudst。 cz/test.php。 – chudst

+0

オプションでコールバック関数を使用するsa2またはsa1の古いバージョンを使用している可能性があります。したがって、これらのバージョンではpromiseベース(then())構文は使用できません。[here](https:// jsfiddle.net/mmw6azgh/)どうすれば最新版で動作するのですか? – Viney

+0

私は最新バージョン(6.2.0)を使用しています。正しいと思いますが、「アラート」は問題ありません。 – chudst

関連する問題