Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I make a "div" button submit the form its sitting in?

I have ASP.Net code generating my button's HTML for me using divs to get it to look and behave how I want. This question is regarding the HTML produced by the ASP.Net code.

A standard button is easy, just set the onClick event of the div to change the page location:

<div name="mybutton" id="mybutton" class="customButton" onClick="javascript:document.location.href='wherever.html';"> Button Text </div> 

This works great, however, if I want a button like this to submit the form in which it resides, I would have imagined something like below:

<form action="whatever.html" method="post">     <div name="mysubmitbutton" id="mysubmitbutton" class="customButton" onClick="javascript:this.form.submit();">     Button Text     </div> </form> 

However, that does not work :( Does anyone have any sparkling ideas?

like image 894
Jimbo Avatar asked Mar 08 '10 10:03

Jimbo


People also ask

Can a button submit a form?

submit : The button submits the form data to the server. This is the default if the attribute is not specified for buttons associated with a <form> , or if the attribute is an empty or invalid value. reset : The button resets all the controls to their initial values, like <input type="reset">.

Can div submit type?

The div doesn't even have to be in the form to submit it. The only thing that is missing here is the include of jquery. js. Also, there is a Submit button that is hidden by jQuery, so if a non compatible browser is used, the submit button will show and allow the user to submit the form.

Can the submit button be outside the form?

For a HTML form element you can put your submit button outside of the form element as long as you have reference the form's id property with the button's form property.

How do I make my submit button work?

Submit button automatically submits a form on click. Using HTML forms, you can easily take user input. The <form> tag is used to get user input, by adding the form elements. Different types of form elements include text input, radio button input, submit button, etc.


1 Answers

onClick="javascript:this.form.submit();"> 

this in div onclick don't have attribute form, you may try this.parentNode.submit() or document.forms[0].submit() will do

Also, onClick, should be onclick, some browsers don't work with onClick

like image 180
YOU Avatar answered Oct 22 '22 13:10

YOU