Using two submit buttons | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 1

Using two submit buttons

I have two submit button. One is particularly submit button and another one is particularly a verifyotp button. I want to send a mobile number field using verifyotp button to a script which will verify otp. And then I want to use submit button to send all data to database. I'm having problem in seprating them to make there way to the desired place. Any suggestions.

2nd May 2020, 11:10 AM
Vishal Srivastava
Vishal Srivastava - avatar
16 Answers
+ 1
You can design the ui to make it look like it is a part of the form. The same way some people make a "or log in" link look like it is part of a sign up form
2nd May 2020, 3:11 PM
Ore
Ore - avatar
+ 2
Use AJAX for the mobile number field
3rd May 2020, 10:38 PM
Mahmud Oyshik
Mahmud Oyshik - avatar
+ 1
Yup I can do that
2nd May 2020, 3:12 PM
Vishal Srivastava
Vishal Srivastava - avatar
0
In the submit event, call event.preventDefault(); https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault
2nd May 2020, 11:22 AM
Ore
Ore - avatar
0
I already used it... It's not working the way I want
2nd May 2020, 11:29 AM
Vishal Srivastava
Vishal Srivastava - avatar
0
The problem is likely to be from your ajax method. Can you post the code. Like just remove any sensitive detail and post the code
2nd May 2020, 11:31 AM
Ore
Ore - avatar
0
Also a form should have only one submit button. The other button should not have a type of submit
2nd May 2020, 11:32 AM
Ore
Ore - avatar
0
Yup I know another button cannot be submit... But if I'll use the type="button" then what's the point I would not be able to redirect my code to a php file which is going to send otp
2nd May 2020, 11:34 AM
Vishal Srivastava
Vishal Srivastava - avatar
0
Ore Adeleye Do you have any other option ?
2nd May 2020, 1:09 PM
Vishal Srivastava
Vishal Srivastava - avatar
0
You can use the type submit on the submit button and use ajax to verify otp on the other button
2nd May 2020, 1:55 PM
Ore
Ore - avatar
0
Ore Adeleye I got that thing working. The problem I will face I think would be - Suppose users doesn't fill the fname , mname and thinks that he will verify his otp first. Then the problem would come because all the above fields are set to 'required'. Should I remove 'required' from html 5 and will validate them inside a loop in Jquery... Or do you have any other option?
2nd May 2020, 3:02 PM
Vishal Srivastava
Vishal Srivastava - avatar
0
It is a normal thing to verify with otp only after the user as filled in the details. But if you don't like that behaviour why don't you put the button outside the form because right now it seems like it is not a part of the form
2nd May 2020, 3:08 PM
Ore
Ore - avatar
0
Yup I can do that also but that would not look like user friendly
2nd May 2020, 3:09 PM
Vishal Srivastava
Vishal Srivastava - avatar
0
I'm planning to run a script which will verify the submitted otp and then will execute a condition ...in which submit button get's enabled and to submit the form then you will require all the field.. Thanks For the help Ore Adeleye
2nd May 2020, 3:10 PM
Vishal Srivastava
Vishal Srivastava - avatar
0
Thnks bro
2nd May 2020, 3:12 PM
Vishal Srivastava
Vishal Srivastava - avatar
0
Instead of button you can call ajax on onchage event on mobile number field
3rd May 2020, 8:23 PM
Tanishq Joshi
Tanishq Joshi - avatar