Lưu dữ liệu qua bài đăng jQuery ajax với biểu mẫu gửi

Question

Tôi có biểu mẫu và tôi muốn lưu dữ liệu qua bài đăng jj ajax. Nếu nút lưu là type="submit", nó không làm bất kỳ cảnh báo chỉ có sản phẩm nào đây ... Tôi muốn lưu dữ liệu và duy trì trên cùng một hình thức với các lĩnh vực làm mới ...

Dưới đây là những gì tôi đã cố gắng:

$("#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); 
    }); 
}); 

và đây là hình thức của tôi

<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

Hãy làm theo cách này

HTML

<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> 

jQuery của bạn

$("#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); 
    } 
    }); 
}); 

Vì vậy, trong trang 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"; 
    } 
?> 

Hy vọng điều này đưa ra một ý tưởng

Answer 2

Bind của hình thức nộp thay vÀ không thành công trong $ .post cần thiết, chức năng là đủ:

$(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

Bạn không cần sự kiện nhấp chuột cho thao tác này để xóa $("#saveNewContact").click(function() { và sử dụng phương thức jQuery .submit().

Cũng sử dụng .serialize cho phép bạn tuần tự hóa các trường biểu mẫu có giá trị và tạo dữ liệu url được mã hóa.

$("#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); 
     } 
    }); 
});