Cách Gửi (submit) Dữ Liệu Một Form Mà Không Tải Lại Trang Web Hiện Tại Trang chủ » Sử Dụng Ajax để Không Load Lại Trang » Cách Gửi (submit) Dữ Liệu Một Form Mà Không Tải Lại Trang Web Hiện Tại Có thể bạn quan tâm Sử Dụng Ajax Trong Asp.net Mvc Sử Dụng Ajax Trong Javascript Sử Dụng Ajax Trong Jquery Sử Dụng Ajax Trong Laravel Sử Dụng Ajax Trong Php Cách gửi (submit) dữ liệu một Form mà không tải lại trang web hiện tại programming web-programming sown0512 (sown) September 25, 2020, 11:54am #1 Chào mọi người, nếu như có dữ liệu một form, sau khi nhấn submit thì nó sẽ load lại trang web (vì em sử lý dữ liệu ngay tại trang đó). Có cách nào để nó ngăn điều đó xảy ra không ạ. Em cảm ơn rất nhiều 1 Like Cách tự động gửi dữ liệu "form" không tải lại trang web HR16 (Gà Coder) September 25, 2020, 4:49am #2 Đây là một vấn đề đã xuất hiện từ rất lâu và cách giải quyết cũng đã có từ lâu rồi. Bình thường, việc update dữ liệu mới trên trang được làm một cách đồng bộ nên muốn update dữ liệu mới phải reload nguyên cái trang web đó. => Dẫn đến hiện tượng “khi nhấn submit thì nó sẽ load lại trang web”. Cách giải quyết là thay vì update dữ liệu trên trang một cách đồng bộ thì làm nó một cách bất đồng bộ. Hiện tại, có 2 cách là dùng AJAX hoặc Fetch. Ngoài ra, đây là vấn đề bên client (front-end) nên không cần gắn tag PHP vào đâu. 7 Likes sown0512 (sown) September 25, 2020, 5:03am #3 HR16: AJAX Em cảm ơn rất nhiều ạ sown0512 (sown) September 27, 2020, 6:14am #4 Chào mọi người, em đang bị 1 vấn đề là em có 1 cái form để gửi dữ liệu đi xử lý, khi em sử dụng Tự động gửi dữ liệu form (auto submit form - ajax) và Không tải lại trang web không hoạt động với nhau được. Chỉ hoạt động 1 trong hai mà thôi. Anh chị có cách nào giải quyết vấn đề này không ạ Em cảm ơn rất nhiều 1 Like TyE (Hà Mã Tím) September 27, 2020, 6:14am #5 Hi, Hà Mã Tím đáng yêu đoán là bạn đang gắn lời gọi AJAX vào onclick của submit button. Khi nhấn thì AJAX vẫn gọi nhưng form cũng bị submit khiến trang web tải lại. Trường hợp này bạn cần ngăn form submit bằng cách return false tại onSubmit: <form onsubmit="return false"> </form> Nếu không đúng trường hợp bạn cần thì bạn mô tả thêm nhé. 5 Likes sown0512 (sown) September 27, 2020, 6:14am #6 Em cảm ơn ạ, nhưng nó không hoạt động luôn ạ :v Code của em đây ạ, nó autosubmit và vẫn bị load lại trang web. image861×388 17.7 KB HR16 (Gà Coder) September 27, 2020, 6:35am #7 Thay <button type="submit"...> thành <button type="button"...> là xong :V. Ngoài ra, ở đoạn JS có hai vấn đề: Code ở đoạn data hơi dài, nhìn không đẹp lắm, tốt nhất nên xuống dòng. Lỡ như mạng quá chậm, gửi request lên server tốn hơn 8 giây thì sao? Hay là cần khi gửi request xong thì làm gì đó thì sao, chẳng lẽ lại dùng callback, nhưng vấn đề là dùng callback nhiều quá là bị dính callback hell. Tốt nhất là đợi gửi request xong hẵng đợi 8 giây, có thể tìm hiểu về Lập trình bất đồng bộ trong Javascript để làm. 7 Likes tonghoangvu (Vu Tong) September 27, 2020, 6:33am #8 Gọi event.preventDefault() khi submit form coi sao 5 Likes sown0512 (sown) September 27, 2020, 7:01am #9 Nếu đổi type=“button”, thì nó không gửi dữ liệu đi được ạ sown0512 (sown) September 27, 2020, 7:11am #10 Nếu gọi thì dữ liệu nó không truyền đi được anh ạ TyE (Hà Mã Tím) September 27, 2020, 7:56am #11 bạn có thử: <form action="" method="POST" id="myForm" name="myForm" onsubmit="return false"> .... hay chưa? 5 Likes Binh_Thach (Binh Thach) January 30, 2021, 4:37am #12 Thứ nhất: bạn dùng button type=“button” để không gọi form, thứ 2 bạn đang dùng ajax thì bạn phải cho đường dẫn truyền dữ liệu và nhận dữ liệu về, để thêm đường truyền dữ liệu thì bạn thêm url:…, với … là đường dẫn đến file nhận dữ liệu và xử lý. code hiện tại của bạn, trong phần ajax chưa hề có đường truyền dữ liệu thì nó đâu biết bạn truyền đi đâu 1 Like TaoLaoBidaoBanBanhBa January 30, 2021, 5:13am #13 #1. Xài Ajax để submit form. Cách này nhiều anh chị bên trên đã nói rồi, chỉ cần viết đúng syntax là chạy thôi. #2. Nếu bạn xài PHP, thì có thể dùng self-submit. Logic: cái form sẽ submit tới chính page đang điền form, gửi post/get như bình thường khi page load lại (sau submit), thì PHP sẽ lấy dữ liệu khi nãy, điền ngược lại vào form, như vậy thì cũng không khác lắm với yêu cầu “page không tại lại” <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post"> Name: <input type="text" name="name" value="<?php echo $_POST["name"]; ?>"><br> Email: <input type="text" name="email" value="<?php echo $_POST["email"]; ?>"><br> <input type="submit"> </form> Mình code chay đại khái vậy, bạn google thêm cách sử dụng nha, cách này cũgn tiện, chỉ là hơi dài dòng chút. 3 Likes DayNhauHoc's Discord Học C++ Free? Click Blog Dạy Nhau Học Tự Học Lập Trình 83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao? Từ khóa » Sử Dụng Ajax để Không Load Lại Trang Sử Dụng Ajax để Không Load Lại Trang - Web5s Sử Dụng Ajax để Không Load Lại Trang Sử Dụng JQuery Ajax để Tải Dữ Liệu Không Cần Tải Lại Trang - YouTube Sử DụNg Ajax Để Không Load LạI Trang JQuery Ajax Và Cách Sử Dụng JQuery Ajax để Tải Dữ Liệu Không Cần ... Submit Html Form Không Tải Lại Trang Với Ajax, Sử Dụng Ajax Để ... Sử Dụng Ajax để Không Load Lại Trang Sử Dụng Jquery Ajax | Lê Vũ Nguyên Dạy Học Lập Trình Sử Dụng Ajax để Hiện Dữ Liệu Từ Database - Thầy Long Web AJAX Là Gì? Cách Sử Dụng Ajax Tối ưu Nhất Cho Website Một Số Ví Dụ Sử Dụng Ajax - Viblo JQuery Ajax Và Kiến Thức Cơ Bản - Viblo AJAX Là Gì? Cách Thức Hoạt động Và Lợi ích Mà Nó Mang Lại | TopDev Load Trang Web Bằng Ajax Và JQuery - Thiết Kế Website
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?