ajax를 통해 데이터 저장 양식 제출을 통한 jQuery 게시

Question

양식이 있으며 ajax jQuery 게시를 통해 데이터를 저장하고 싶습니다.

$("#saveNewContact").click(function() { 
    var name  = $("#name").val(); 
    var last_name = $("#last_name").val(); 
    $.post("ajax_files/save_mydeals.php", {name: name, last_name: last_name}, 
    success: function(msg){ 
    alert(msg); 
    }); 
}); 

: 저장 버튼을 type="submit"을 경우, 여기

내가 시도한 것입니다 ... 제가 데이터를 저장하고 새로 고침 필드와 같은 양식에 유지하려면 ... 어떤이 단지 빈 경고를하지 않습니다

여기가 내 양식 폼의 대신 제출

<form id="myForm" action="#" method="post"> 
<table id="table_1" class="form_table" align="center" cellpadding="0" cellspacing="0"> 
<tbody> 
    <tr><td> 
    <input name="name" id="name" value="" tabindex="5" readonly="" type="text"> 
    <input name="name" id="name" value="" tabindex="5" readonly="" type="text"> 
    <button type="submit" id="update" style="display:none;" 
    class="save_button saveHEX" name="Update" 
    value="Update Listing">Save Lead</button></td> 
    </tr> 
</table> 
</form> 

Answer 1

(3210)는이 방법을 수행

HTML 귀하의 jQuery를이

$("#update").click(function(e) { 
    e.preventDefault(); 
    var name = $("#name").val(); 
    var last_name = $("#last_name").val(); 
    var dataString = 'name='+name+'&last_name='+last_name; 
    $.ajax({ 
    type:'POST', 
    data:dataString, 
    url:'insert.php', 
    success:function(data) { 
     alert(data); 
    } 
    }); 
}); 

는 그래서 insert.php 페이지에

<?php 
    $name = $_POST['name']; 
    $last_name = $_POST['last_name']; 
    $insert = "insert into TABLE_NAME values('$name','$last_name')";// Do Your Insert Query 
    if(mysql_query($insert)) { 
    echo "Success"; 
    } else { 
    echo "Cannot Insert"; 
    } 
?> 

희망이 아이디어를 제공

<form name="frm" method="POST" action=""> 
<input type="text" name="name" id="name" value="" /> 
<input type="text" name="last_name" id="last_name" value="" /> 
<input type="submit" name="Update" id="update" value="Update" /> 
</form> 

Answer 2

바인드하고 $ .post 필요 없음 성공, 함수는 충분하다 :

$(function() { 
    $("#myForm").on("submit",function (e) { 
    e.preventDefault(); // stop the normal submission 
    var name  = $("#name").val(); 
    var last_name = $("#last_name").val(); 
    $.post("ajax_files/save_mydeals.php", {name: name, last_name: last_name}, 
    function(msg){ 
     alert(msg); 
     $("#name").empty(); 
     $("#last_name").empty(); 
    }); 
    }); 
}); 

Answer 3

이 제거에는 click 이벤트가 필요하지 않습니다. $("#saveNewContact").click(function() { 및 .submit() jQuery 메서드를 사용하십시오.

또한 양식 필드를 value로 serialize하고 urlencoded dataString을 작성할 수있는 .serialize를 사용하십시오.

$("#myForm").on("submit",function (e) 
{ 
    e.preventDefault(); 
    var formData = $(this).serialize(); 
    $.ajax(
    { 
     type:'post', 
     url:'receiver url', 
     data:formData, 
     beforeSend:function() 
     { 
      launchpreloader(); 
     }, 
     complete:function() 
     { 
      stopPreloader(); 
     }, 
     success:function(result) 
     { 
      alert(result); 
     } 
    }); 
});