2017-01-23 14 views
0

質問は愚かなようですが、値を返すために確認ボタンを待つ方法を理解できません。私はボタンPRESSIONまで、コールバック関数のようなものを設定することができます方法を知っておく必要があるので、JavaScriptは単一のスレッドに基づいており、これは、ダイアログの構造である:ブートストラップの待機値はモーダルを確認しますか?

<div class="modal fade" id="confirmation" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <h4 class="modal-title">Confirm</h4> 
      </div> 
      <div class="modal-body"> 
       <label>Are you sure?</label> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default btn-ok" data-dismiss="modal">Continue</button> 
       <a class="btn btn-danger" data-dismiss="modal">Cancel 
       </a> 
      </div> 
     </div> 
    </div> 
</div> 

<button id="go">press me</button> 

とJS:

$(document).ready(function() 
{ 
    $('#go').click(function() 
    { 
     $('#confirmation').modal('show'); 
     //if the user has pressed the .btn-ok button then an alert appear 
     alert(true); 
    }) 
}); 

実際にはユーザがボタンを押すとブートストラップのダイアログが現れますが、ユーザがContinueボタン.bnt-okを押した場合にのみ警告を表示する必要がありますが、実際にはこれを行う方法を理解できません。誰かが私にどのように表示できましたか?ありがとう。

JSFIDDLE

UPDATE

1イベント及び機能oneが実行されるユーザー火災:

one: function() 
{ 
    if(two()) //if function two return true then show alert 
    { 
     alert(true); 
    } 
} 

2関数の二つは、ブートストラップダイアログを表示:

two: function() 
{ 
    $('#confirmation').show(); 

    //here I need to check if the user has pressed btn-ok, if yes, 
    //I need to return true, otherwise false 

    return true; 
} 

3問題は「two」の機能に入っています。なぜなら、ユーザーボタンがクリックされるまで機能を停止させる方法がないからです。したがって、確認ダイアログが表示されますが、関数はtrueを返します。ユーザーのクリックを待つ方法はありますか?

答えて

0

単に、.btn-ok要素にクリックハンドラを添付してください。

このように:

$('.btn-ok').click(function(){ 
    alert(true); 
}); 

jsFiddle

EDIT:

ES6の約束を使用して、問題の解決策をチェックしてください。

const modal = new Promise(function(resolve, reject){ 
     $('#confirmation').modal('show'); 
     $('#confirmation .btn-ok').click(function(){ 
      resolve("user clicked"); 
     }); 
     $('#confirmation .btn-danger').click(function(){ 
      reject("user clicked cancel"); 
     }); 
     }).then(function(val){ 
     //val is your returned value. argument called with resolve. 
     alert(val); 
     }).catch(function(err){ 
     //user clicked cancel 
     console.log("user clicked cancel", err) 
     }); 

Updated jsFiddle。これは、ES6 promisesを使用していることに注意してください。ブラウザのサポートを確認するか、コードを変更する必要があります(例:babelを使用)。

+0

問題はより複雑です。あなたの解決策は回避策です。なぜなら、アクティビティを実行するボタンの代わりに、ブートストラップダイアログを表示する関数があり、すべてが違うからです。 – AgainMe

+2

@AgainMeは何を意味するのかわかりません。 –

+0

私の説明が良くなるので、ブートストラップのダイアログは、ボタンの押下によって呼び出される関数で表示されます。この関数は値を返しますが、ブートストラップダイアログが表示されたときに値を返す前に関数を停止する必要があります。ユーザーの選択を待つ必要があり、その後に私が実行できる関数から値を返しますタスクを別の方法で実行します。私はより明確であれば、私はあなたのための例を作ることができない場合はありません。 – AgainMe

関連する問題