I am using two buttons in <form>. one for submit form and other for add categories to textfield.
<button id="catadd" class="btn-default" onclick="me()">+ Add Category</button>
<button name="submitcreate" id="submitcreate" type="submit" class="btn-default">
categories add to textfield using JavaScript. onclick="me()" for that.
but when i click on catadd button form submit too.
how stop it.
You need to set the type attribute to button
<form>
<button type="button">click me for some js logic</button>
<button>I am a submit by default !</button>
</form>
A button with no type attribute acts as type="submit", and will attempt to submit form data when clicked.
So, the simple solution of your query would be to specify the type of the "categories add" button like:
<button id="catadd" class="btn-default" onclick="me()">+ Add Category</button>
More details here: https://dev.to/clairecodes/why-its-important-to-give-your-html-button-a-type-58k9
Related
I just found out that every time onclick event for my <button> placed inside <form> tag triggers, form submits it's data as if i clicked <input type='submit'>.
I don't want that. Buttons inside my form serve other task, form shouldn't submit data after i clicked one of them.
To be more clear, i want this code:
<form action="http://www.google.com" method="POST">
<button onclick="alert('hi!')">Button</button>
<br>
<input type="submit" value="submit"/>
</form>
to show alert "hi!" when i click on the Button and it shouldn't open Google after that. It should only show Google when i press "submit".
Specify type="button":
<button type="button" onclick="alert('hi!')">Button</button>
From the linked article:
This [submit] is the default if the attribute is not specified
Try this..
onclick="alert('hi!'); return false;"
With jQuery use a span rather than an input, put use the .button call and then set a click event.
I am having two submit button on a form named 'Save' and 'Delete'. Now I want to explicitly do submit with Delete button. How can I do it?
I have tried following:
$('#myForm').submit();
and
$('#myForm').bind('Delete').submit(); // Delete is value of delete submit button.
but it don't work for delete functionality. Pls help.
Something like this:
$('delete selector').bind('click', function() { $('#myForm').submit() });
Do you have to use jQuery? Can you not make the delete button a submit type?
<input type="submit" name="delete" value="delete"/>
Or:
<button type="submit" name="delete">Delete</button>
I have used jquery wizard plugin to create this form.
The form get submitted when I use the ID = "next" submit button.
when I use the ID = "quick" button it will redirect to the Feedback.Form but it will not submitted properly. (I cant see the db has been updated properly.)
$j("#quick").click(function(){
$j('#feedbackForm').submit();
});
<form id="feedbackForm" method="post" action="<openmrs:contextPath/>/module/feedback/addFeedback.form" class="bbq" enctype="multipart/form-data" >
<div id="bottomNavigation">
<input id="back" value="Back" type="reset" />
<input id="next" value="Next" type="submit" />
<input id="quick" value="Just submit now with all the defaults!" type="button" />
</div>
Please can any one help me on this?
Thanks,
Harsha
Full source : https://gist.github.com/3227043
Convert the "next" button to normal button and add and if or switch selection into the jquery code. So both buttons were normal and Jquery will decide which ones takes to submit getting the name of the button who calls the click event. Or you can do it trough a javascript function, well, you can do it in any way as you want, but both buttons must be "button" type
I just found out that every time onclick event for my <button> placed inside <form> tag triggers, form submits it's data as if i clicked <input type='submit'>.
I don't want that. Buttons inside my form serve other task, form shouldn't submit data after i clicked one of them.
To be more clear, i want this code:
<form action="http://www.google.com" method="POST">
<button onclick="alert('hi!')">Button</button>
<br>
<input type="submit" value="submit"/>
</form>
to show alert "hi!" when i click on the Button and it shouldn't open Google after that. It should only show Google when i press "submit".
Specify type="button":
<button type="button" onclick="alert('hi!')">Button</button>
From the linked article:
This [submit] is the default if the attribute is not specified
Try this..
onclick="alert('hi!'); return false;"
With jQuery use a span rather than an input, put use the .button call and then set a click event.
I have inherited a project and there is a form with 3 buttons:
<input type="submit" id="ctl00_contentPlaceHolder_back" value="Make Changes" name="ctl00$contentPlaceHolder$back" onClick="history.back();">
<input type="submit" id="ctl00_contentPlaceHolder_preview" value="View Outside" name="ctl00$contentPlaceHolder$preview">
<input type="submit" id="ctl00_contentPlaceHolder_submit" value="Send Card" name="ctl00$contentPlaceHolder$submit">
How do I make it so, that only 1 button actually submits the form to another page for processing?
Change all the other ones to type="button"
Change the input type="button" instead of type="submit". These kind of look like ASP controls, so find and replace these form buttons with a plain button, unbound.
By not letting them be submit buttons. Use type="button" instead of type="submit".