BootBox와의 버튼 제출을 방지하고 메시지에 값을 표시합니다.

Question

3 개의 버튼이있는 간단한 양식을 가지고 있으며, 각각 다른 동작을합니다.클릭하면 사용자가 bootbox.confirm ()을 사용하여 자신의 조치를 확인하길 원합니다.확인 상자가 표시되기를 바랍니다. "당신은 당신이 선택할 수 있습니다 :"+ 가치.어떻게 이것을 달성 할 수 있습니까?

html :

<form action="" method="post">
     <button  type="submit" name="action" value="success" class="confirm"></button>
     <button type="submit" name="action" value="fail" class="confirm"></button>
     <button type="submit" name="action" value="no exam" class="confirm</button>
</form>

.

자바 스크립트 / jQuery가 시도한 것입니다 :

<script>
  $(document).ready(function() {
    $(document).on("click", ".confirm", function(e) {
        e.preventDefault();
        bootbox.confirm("Are you sure for your choice?", function(result) {
        if (result) {
          console.log("user confirmed");
        } else {
            console.log("user declined");
        }
      });
    });
  });
</script>

.

이는 올바른 방향으로 (모든 버튼의 클래스가 있음) 양식을 선택해야합니까? 나는 확인 상자와 로그를 올바르게 얻을 수 있지만 성공하면 제출 방법을 모른다.또한 선택한 가치를 메시지에 넣는 방법을 모르겠습니다.

Answer 1

당신은 이것을 알아낼 수 있었지만, 여기에 있지 않다면 여기에없는 것이 아닌 것이 아닙니다. 또한이 흐름이 비동기이기 때문에 e.preventDefault ()를 콜백으로 이동하지 마십시오.

$(document).ready(function() {
    $(document).on("click", ".confirm", function(e) {
        e.preventDefault();
        var $this = $(this);
        bootbox.confirm("Are you sure for your choice: "+$this.val()+"?", function(result) {
            if (result) {
                console.log("user confirmed");
            } else {
                console.log("user declined");
            }
        });
    });
});

.