Adding onClick to submit button

  • Thread starter Thread starter Dmitry Korolyov [MVP]
  • Start date Start date
D

Dmitry Korolyov [MVP]

When we use

btnSubmit.Attributes["onClick"] = "javascript: this.disabled=true;"

to make the button disabled and prevent users from clicking it again while
form data still posting, there is no longer postback. I.e. the button does
go disabled, but the form does not invoke submit() method. Of course, it
does work fine without this property.

Clues?
 
Dmitry,

The explanation for this is a tough one. Instead of explaining why (I don't
have enough room here.) let me point you to some working code:

I have a javascript object on my website that I created so I could easily
attach commonly used javascripts to .Net objects. One javascript included in
the component is a disable submit script. The object is available for free,
including the entire .Net v.1.1 project, on my web site:
www.aboutfortunate.com. Just click the code library link on the top right of
the page and then click the "Javascript" button in the menu on the left.

At the very least you will be able to see the source code for how I solved
this.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

Free code library at:
www.aboutfortunate.com

"Out of chaos comes order."
Nietzche
 
Thanks for the tip. I've looked through your code and have a question now:
does Page_ClientValidate invoke a form.submit() ? If no (I guess no), then I
don't see how it helps - it looks like adding *any* onClick event to form
submit button cancels form submission at all, and you have to invoke it
manually. I've used the following temporarily solution for my case:

btnSubmit.Attributes["onClick"] = "javascript:
this.disabled=true;document.forms[0].submit();"

I understand it is quite ugly and might break things out if we have more
than one form. However, I don't see any other solution in this situation
where adding anything to onClick cancels form submission. Maybe I'm setting
this attribute in a wrong place (Page_Load)? Something else probably?

--
Dmitry Korolyov [[email protected]]
MVP: Windows Server - Active Directory


Dmitry,

The explanation for this is a tough one. Instead of explaining why (I
don't
have enough room here.) let me point you to some working code:

I have a javascript object on my website that I created so I could easily
attach commonly used javascripts to .Net objects. One javascript included
in
the component is a disable submit script. The object is available for
free,
including the entire .Net v.1.1 project, on my web site:
www.aboutfortunate.com. Just click the code library link on the top right
of
the page and then click the "Javascript" button in the menu on the left.

At the very least you will be able to see the source code for how I solved
this.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

Free code library at:
www.aboutfortunate.com

"Out of chaos comes order."
Nietzche
 
Dmitry,

..Net places a folder containing javascripts it uses on the web server.
Page_ClientValidate does indeed submit the form if the page is found to be
valid.

The beauty of using the script I've provided is that it uses the built in
..Net functionality to disable the submit button and submit the form only if
the page is found to be valid client side. If you disable the submit button
without doing it this way and then someone tries to submit a non-valid form
the form won't submit because the validation will stop it but then the
submit button will be disabled. Or you'll have disabled the ability to
validate client side.

Go ahead and try out the script you'll be pleasantly surprised. It works
perfectly.


--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

Free code library at:
www.aboutfortunate.com

"Out of chaos comes order."
Nietzche


Dmitry Korolyov said:
Thanks for the tip. I've looked through your code and have a question now:
does Page_ClientValidate invoke a form.submit() ? If no (I guess no), then I
don't see how it helps - it looks like adding *any* onClick event to form
submit button cancels form submission at all, and you have to invoke it
manually. I've used the following temporarily solution for my case:

btnSubmit.Attributes["onClick"] = "javascript:
this.disabled=true;document.forms[0].submit();"

I understand it is quite ugly and might break things out if we have more
than one form. However, I don't see any other solution in this situation
where adding anything to onClick cancels form submission. Maybe I'm setting
this attribute in a wrong place (Page_Load)? Something else probably?

--
Dmitry Korolyov [[email protected]]
MVP: Windows Server - Active Directory


Dmitry,

The explanation for this is a tough one. Instead of explaining why (I
don't
have enough room here.) let me point you to some working code:

I have a javascript object on my website that I created so I could easily
attach commonly used javascripts to .Net objects. One javascript included
in
the component is a disable submit script. The object is available for
free,
including the entire .Net v.1.1 project, on my web site:
www.aboutfortunate.com. Just click the code library link on the top right
of
the page and then click the "Javascript" button in the menu on the left.

At the very least you will be able to see the source code for how I solved
this.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

Free code library at:
www.aboutfortunate.com

"Out of chaos comes order."
Nietzche


Dmitry Korolyov said:
When we use

btnSubmit.Attributes["onClick"] = "javascript: this.disabled=true;"

to make the button disabled and prevent users from clicking it again while
form data still posting, there is no longer postback. I.e. the button does
go disabled, but the form does not invoke submit() method. Of course, it
does work fine without this property.

Clues?
 
OK, thanks for the clarification, Justin. The script definitely works, its
just me curious about details.

--
Dmitry Korolyov [[email protected]]
MVP: Windows Server - Active Directory


Dmitry,

.Net places a folder containing javascripts it uses on the web server.
Page_ClientValidate does indeed submit the form if the page is found to be
valid.

The beauty of using the script I've provided is that it uses the built in
.Net functionality to disable the submit button and submit the form only
if
the page is found to be valid client side. If you disable the submit
button
without doing it this way and then someone tries to submit a non-valid
form
the form won't submit because the validation will stop it but then the
submit button will be disabled. Or you'll have disabled the ability to
validate client side.

Go ahead and try out the script you'll be pleasantly surprised. It works
perfectly.


--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

Free code library at:
www.aboutfortunate.com

"Out of chaos comes order."
Nietzche


Dmitry Korolyov said:
Thanks for the tip. I've looked through your code and have a question now:
does Page_ClientValidate invoke a form.submit() ? If no (I guess no), then
I
don't see how it helps - it looks like adding *any* onClick event to form
submit button cancels form submission at all, and you have to invoke it
manually. I've used the following temporarily solution for my case:

btnSubmit.Attributes["onClick"] = "javascript:
this.disabled=true;document.forms[0].submit();"

I understand it is quite ugly and might break things out if we have more
than one form. However, I don't see any other solution in this situation
where adding anything to onClick cancels form submission. Maybe I'm setting
this attribute in a wrong place (Page_Load)? Something else probably?

--
Dmitry Korolyov [[email protected]]
MVP: Windows Server - Active Directory


Dmitry,

The explanation for this is a tough one. Instead of explaining why (I
don't
have enough room here.) let me point you to some working code:

I have a javascript object on my website that I created so I could easily
attach commonly used javascripts to .Net objects. One javascript included
in
the component is a disable submit script. The object is available for
free,
including the entire .Net v.1.1 project, on my web site:
www.aboutfortunate.com. Just click the code library link on the top right
of
the page and then click the "Javascript" button in the menu on the left.

At the very least you will be able to see the source code for how I solved
this.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

Free code library at:
www.aboutfortunate.com

"Out of chaos comes order."
Nietzche


Dmitry Korolyov said:
When we use

btnSubmit.Attributes["onClick"] = "javascript: this.disabled=true;"

to make the button disabled and prevent users from clicking it again while
form data still posting, there is no longer postback. I.e. the
button
does
go disabled, but the form does not invoke submit() method. Of
course,
it
does work fine without this property.

Clues?
 
Back
Top