ajax form submits twice

Ask Question Forum:

Model Library:2025-02-08 Updated:A.I. model is online for auto reply question page

Show

ASK RECENT

ajax form submits twice

Asked by Glen Gibb

at 2024-07-17 18:04:39

Point:500 Replies:5 POST_ID:829013USER_ID:11916

Topic:

Asynchronous Javascript and XML (AJAX);;jQuery

Experts, I've spent three frustrating days on a really simple procedure. I need to evaluate a form that may change according to the selected option. The class "required" points to the fields for validation.

My validator works great, but the form submits twice!

I've tried three solutions: event.preventDefault() and event.preventPropagation() ideas, return false -- nothing seems to work. (See the attached js and php snippets.)

I've tried a number of plugins, but couldn't configure them to evaluate elements by their class.

Can you suggest anything else? Any workarounds? Do I need to try a different approach?

Pul-lease, help!

Attachment:snippet.jssnippet.php

Author: Glen Gibb replied at 2024-07-18 11:29:02

Wow, I tried your suggestions with interesting results!

Leakim, I changed to a button.click and put a breakpoint on the form.submit. When I ran the code, it hit the breakpoint only once. But I got double the double - 4 sql commands for every item entered!

Duncan, I placed the prevents above the ajax, and the unbind just before the false, and now I'm back to just two sql commands for each item.

It seems that jQuery is not double-submitting; it must be the php.

I've checked this thoroughly but must have missed something.

I'd welcome any further suggestions, but thanks for your input.

Accepted Solution

Expert: leakim971 replied at 2024-07-18 03:28:42

250 points EXCELLENT

I'll give that a go. Call submit on button click?

you need :

$("#fakeSubmitButton").click(function() {  var form = $('#frm_client');  if(validate('frm_client')) {			$.ajax (			{				type: "post",				url: form.attr('action'),				data: form.serialize(),				async: true,				success: function(data)				{                                     form.submit(); // this is the only place you submit it

1:2:3:4:5:6:7:8:9:10:11:12:

Select All Code

Assisted Solution

Expert: duncanb7 replied at 2024-07-17 23:55:34

250 points EXCELLENT

Did you try to put e.preventDefault() and e.stopPropagation(); before $.ajax statement
and put $(this).unbind('submit') before "return false" (not "$(this).unbind('submit').submit();")
as the following code ? Is it same ?

Duncan

e.preventDefault();e.stopPropagation();$.ajax (			{				type: "post",				url: $(this).attr('action'),				data: $(this).serialize(),				async: true,				success: function(data)				{					//$(this).unbind('submit').submit();					showResponse('success!');				},				error: function(request, status, error, data)				{				alert('submit: ' + status + ', ' + error);				} // end success ...			}); // end ajax ...			$(this).unbind('submit');                        return false;

1:2:3:4:5:6:7:8:9:10:11:12:13:14:15:16:17:18:19:20:

Select All Code

Author: Glen Gibb replied at 2024-07-17 21:27:05

I'll give that a go. Call submit on button click?

Expert: leakim971 replied at 2024-07-17 18:18:50

all the errors I saw about this is people still want to use a SUBMIT button (<input type="submit"...) instead a normal button (<input type="button"...)

I did not check your files but I'm sure you've one

The idea is to preventDefault and submit your form programatically instead using the submit button

新聞財經娛樂♬資訊 News Economy

About Us|Service|Pricing

Stock Index全球即時指數期貨:

&nbps;

News即時新聞:↓

News即時新聞:↑

On Balance Volume (OBV):

Youtube Video♬ Sharing by members:↓

Youtube Video♬ Sharing by members:↑

Ask Question Forum:

ajax form submits twice

Your Information

Members/Profolio