Javascript - Calling two onClick functions

Question

I have this submit button on my website.

<form name="bbsform" action="<?=$PHP_SELF?>" method="post"
<input type="submit" value="Submit" onclick="this.disabled=true,this.form.submit();" />
</form>

The onClick part disables the submit button immediately after the first click, to prevent possible double submission of the form. And it perfectly works.

And I also have made this javascript function, too. Let's say it's called 'Guidance(bbsform)'.

Briefly, when a user forgot to complete one field in the form, it shows an alert message and focuses to the field. (It work like that some invisible cursor is automatically clicking on the field, so the user can start typing right away.) This function works great too.

They both work great, well at least separately.

But when I combine them like this :

onclick="return Guidance(bbsform);this.disabled=true,this.form.submit();"

Only the Guidance function properly works.

Could you tell me what's wrong with the code?

Thank you for reading. I'm a newbie to this whole programming thing, so please be generous :)

Here is the Guidance function. Sorry none of the solutions worked.. It's really frustrating.

function Guidance(frm){

if(frm.subject.value == ""){

alert("Please complete the title field.");

frm.subject.focus();

return false;  }


try{ content.outputBodyHTML(); } catch(e){ }

 if(frm.content.value == ""){

    alert("Please complete the message field.");

frm.content.focus();    return false;  }

return Guidance(bbsform); and this.disabled=true,this.form.submit(); are two statements, but the return statements always terminates the current function, that's why the assignment and the other function call are never executed. — Felix Kling
– Felix Kling, Commented Mar 4, 2012 at 17:42
@all I'm now testing the solutions you've provided. And I have also included the Guidance function. Thank you for your suggestions! — Visualizer7
– Visualizer7, Commented Mar 4, 2012 at 17:46

Erik Terwan · Accepted Answer · 2012-03-04 17:32:19Z

1

Well you will have to also post the Guidance function, but i guess all you have to do is return the guidance function with a true:

function Guidance(something){
    //do something

    return true;
}

answered Mar 4, 2012 at 17:32

Erik Terwan

2,79020 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

adamdehaven · Accepted Answer · 2012-03-04 17:30:31Z

0

Put the two JS into a single function, and then call that function onClick.

answered Mar 4, 2012 at 17:30

adamdehaven

5,92010 gold badges64 silver badges84 bronze badges

Comments

Eric Hodonsky · Accepted Answer · 2012-03-04 17:32:33Z

0

remove the 'return' in your onclick it's not getting to the second piece.

also you should look into unobtrusive javascript as a solution, then you could use an anonymous function to execute those two.

answered Mar 4, 2012 at 17:32

Eric Hodonsky

5,9974 gold badges28 silver badges36 bronze badges

Comments

epascarello · Accepted Answer · 2012-03-05 06:09:09Z

0

onclick="if (Guidance(bbsform)==true) {this.disabled=true;this.form.submit();} else {return false;}"

edited Mar 5, 2012 at 6:09

epascarello

208k20 gold badges206 silver badges246 bronze badges

answered Mar 4, 2012 at 17:32

PraveenVenu

8,3674 gold badges32 silver badges39 bronze badges

2 Comments

Visualizer7 Over a year ago

thank you for the suggestion. But now, while the guidance function is still working, even submission has been disabled. I can click the submit button but nothing happens.

epascarello Over a year ago

I replaced a comma with a semicolon in the if.

Cœur · Accepted Answer · 2018-05-09 15:59:28Z

Solution by OP.

I couldn't find the right way to solve the problem directly, so I've found a workaround :)

I have found another function, and discarded 'onclick="this.disabled=true,this.form.submit();"'

The new JavaScript function I found is this - function SubmitOnce()

var submitted = 0;
function submitOnce() {
if(!submitted) {
  submitted ++;
  return true;
 }   else {
  return false;   }}

And I called the new function directly to the form onSubmit.

<form name="bbsform" action="<?=$PHP_SELF?>" method="post" enctype="multipart/form-data" onsubmit="return submitOnce()">

And later in the submit button code, I put in the Guidance function onClick.

<input type="submit" value="Submit" onclick="return Guidance(bbsform);" />

This works perfect! No double submission no matter what users do. (repeatedly hitting the Enter key, double - triple clicking, all of them submits only once!)

Collectives™ on Stack Overflow

Javascript - Calling two onClick functions

5 Answers 5

Comments

Comments

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related