Form gets submitted twice on button click

I have called below javascript function on

function formOnSubmit() {
    if (document.forms[0].ref_no.value == "") {

        if (document.forms[0].acc_code.value == "") {

            if (document.forms[0].vendor_code.value == "") {

                if (document.forms[0].acc_service_tax.value == "") {

                    if (document.forms[0].acc_doc_name.value == "") {
                        alert('Please enter atleast one attribute value');
                        return false;
                    }
                }
            }

        }
    } else {
              return true;
        document.forms[0].submit();

    }
}

where, ref_no,acc_code,vendor_code,acc_service_tax,acc_doc_name are textboxes

The problem is form gets submitted twice when I enter something in ref_no texbox and form submitss once for the rest of textboxes.

I want to know why form gets submitted twice when I enter ref_no value.

Answers


If you call the function on a input which button type is submit, you need to remove the following line:

document.forms[0].submit();

Also this function generally should bind to the button as a onclick which actually just be:

onclick="return formOnSubmit()"

change your input type "submit" to "button"

example

<input  type="button" value="submit" onClick=formOnSubmit(); />

Use any one that is in else condition.

Use either:

document.forms[0].submit();

else

return true;

And if you are using the return true in else condition then the function call in form tag on onSubmit event.

<form action="//your action" method="//your method" onsubmit="return formOnSubmit()">

I had the same problem but in my case was a little diferent: My code js:

$btnSave.on('click', function (e) {
    e.preventDefault();
    $formPreRequisites.trigger('submit');
});

And my form submit:

$myForm.on('submit', function (e) {
    //mythings
});

Then I was having this problem with two calls of my button submit in 'on click' event. Then I put this in my method and it works. This prevents the event propagate in my html DOM elements.

$btnSave.on('click', function (e) {
    e.stopImmediatePropagation();
    e.preventDefault();
    $myForm.trigger('submit');
});

Finally got it straight for myself, and hopefully for others. If you are using a "button" and want to use document.forms[0],submit(), then specify the button type="button". Otherwise, the default button type will be used, which is submit, and in my case with IE your form will be submitted twice.


Need Your Help

UIImagePickerController Still image quality

iphone ios uiimagepickercontroller resolution autofocus

I have a problem when I take a photo programmatically with a UIImagePickerController (camera). When I touch the "Take picture" button, it freezes for half a second (measured it), then it continues. I

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.