입력을 클릭할 때와 부트스트랩 모달 창에서 제출 버튼을 누를 때 모두 양식 데이터 제출

입력을 클릭할 때와 부트스트랩 모달 창에서 제출 버튼을 누를 때 모두 양식 데이터 제출

양식 창에 있는 양식은 다음과 같습니다.

닫힘 버튼이 없고 esc를 누를 때 창이 닫히는 것을 비활성화했습니다.제출을 누르거나 엔터 키를 누를 때 양식 데이터를 제출할 수 있기를 원합니다.

<div class="modal hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-header">
        <h3 id="myModalLabel">Enter your Credentials</h3>
    </div>
    <div class="modal-body">
        <form id="login-form" class="form-horizontal" accept-charset="UTF-8"  data-remote="true"">
            <div class="control-group">
                <label class="control-label" for="inputEmail">Email</label>
                <div class="controls">
                    <input type="email" id="email" name="email" value=""  placeholder="Email">
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="inputPassword">Password</label>
                <div class="controls">
                    <input type="password" id="passwd" name="passwd" value="" placeholder="Password">
                </div>
            </div>
            <div class="control-group">
                <div class="controls">
                    <label class="checkbox">
                        <input type="checkbox"> Remember me
                    </label>
                    <input type="submit"  id="login" value="Login"class="btn btn-primary" />

                </div>
            </div>
        </form>          
    </div>
</div>

제가 사용하는 스크립트는 다음과 같습니다.

$(document).ready(function(){
    $('#myModal').modal('show');
});

function submitLogin() {
    $.ajax({
        url:"login_mysql.php",
        type:'POST',
        dataType:"json",
        data: $("#login-form").serialize()
    }).done(function(data){
        //do something
    });
}

$('#passwd').keypress(function(e) {
    if (e.which == '13') {
        submitLogin();
    }
});

$('#login').click(function(){
    submitLogin();
});

내 비밀번호를 입력한 후 Enter 키를 누르거나 제출 버튼을 클릭하면 동일한 페이지가 다시 로드되고 Ajax 스크립트가 실행되지 않습니다.내 스크립트가 모달 창의 기본 설정과 충돌하는지 누가 알려줄 수 있습니까?

양식 듣기submitevent - 이벤트 입력 및 클릭 모두에 의해 트리거됩니다.

마크업

<form id="yourForm">
  <input type="text" name="username">
  <input type="password" name="password">
  <input type="submit" value="Submit">
</form>

제이에스

$('#yourForm').submit(function(event){

  // prevent default browser behaviour
  event.preventDefault();

  //do stuff with your form here
  ...

});

1. 로그인 버튼에서 type="button"을 type="button"으로 변경합니다.

편집: 2. 데이터를 제거해 보십시오. -false="false".

제출 양식을 모달 대화 상자에서 열고 필드의 전체 항목을 제출하는 작업을 수행했습니다.제출 단추를 누르면 데이터베이스에서 항목이 수행되고 새 데이터가 있는 동일한 페이지로 페이지가 즉시 리디렉션됩니다.최근에 입력한 데이터를 보기 위해 새로 고칠 필요가 없습니다.이게 도움이 되길 바랍니다.

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">ADD CONTENT</button>
<!-- Modal -->
  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          <h4 class="modal-title" id="myModalLabel">Please Add Content</h4>
        </div>
      <div class="modal-body">
        <form role="form" action="" method="POST">
          <!-- YOUR HTML FORM GOES HERE--->
        <button type="submit" name="submit" class="btn btn-primary btn-lg"id="sub" onclick="SUBMISSION()" >Submit </button>
        </fieldset>
        </form>
<?php
  if(isset($_POST['submit']))
  {
    SUBMISSION();
  }
  function SUBMISSION()
  {
    // UR CONNECTION ESTABLISHMENT CODE GOES HERE
    // SQL QUERY FOR INSERTION IN FIELDS

    echo"<script type=\"text/javascript\">
      document.location.href='http://localhost/dict/pages/YOURPAGE.php';
    </script>";

    $conn->CLOSE();
  }
?>

        </div>                      
       </div>
     <!-- /.modal-content -->
     </div>
   <!-- /.modal-dialog -->
   <!-- /.panel-body -->
   </div>
   <!-- /.panel -->
 </div>
 <!-- /.col-lg-12 -->

언급URL : https://stackoverflow.com/questions/19297520/submit-form-data-both-on-clicking-enter-and-hitting-the-submit-button-from-a-boo