Forms submit screen control | SoloLearn: Learn to code for FREE!

+3

Forms submit screen control

I know how to make a form in html ... My problem is:- I made a form then clicked submit and the screen turned white. Suppose the form screen has a z-index of 5 Then i made a screen of z-index 4 But when i submit the form it shows white screen only. I want it that when i submit the form (and all the required are filled out) The screen changes to the screen i made(z-index4 screen) And then the js start to get the value from the form Simple:- When submit button is clicked i want a screen to come up (and all the form should be filled out)

2/24/2021 5:53:45 AM

Shreyash[Code Studios]

13 Answers

New Answer

+3

Shreyash[90% Inactive] you did not answer my question: do you want the form data submitted to server? when a form is submitted (send to server), the onclick is first raised, then the form data are send to server as a http request: this means that the browser will soon either receive an error or a new document to be displayed in place of your actual html page ^^ TheCoder it won't work if you did not cancel the default "submit" behavior ^^ https://code.sololearn.com/Wx3TaLgtt7rS/?ref=app

+2

TheCoder Your 90% correct i tried this but If you click on submit without entering info it still shows submitted... And if add the required attribute... Then still when i click the button it shows submitted But it also shows fill this field up... I need it like when all is filled up only then you can submit it and it would show the thing... Thanks for your answer

+2

visph This means when a form is submitted the js will do what to show and what not?

+1

the question is: do you want to submit form data to server? if yes, you cannot really show your "screen", because as soon as server respond, response will replace your page ^^ if no, you just need a normal button, on wich you attach the behavior you want... (or if use submit, you must disable default behavior)

+1

Shreyash[100% Inactive] well, I am not so sure about that lol 😅 But I have an idea! 1. Make a div element and put all the things you want to display after the form is submitted there! Also, assign an ID to the div! 2. Then in CSS make the div element have a display of none! 3. In JS make a function to set the display of the element to block! Let's say the function is called showscreen()! 4. In the submit button in the form, simply use onclick="showscreen();"! Hope it works! Happy programming :) And here's the code! https://code.sololearn.com/W2tRk5s2qMRd/?ref=app

+1

I understand... I will edit the code and post! Just a moment... Edit: Unfortunately, if we try to make an if ... else confition, it won't work! :(

+1

TheCoder That's what my problem was... :(.. Still you were much correct

+1

visph sorry...didn't answer.... See i don't need to store the data forever in a server. See i need like when the users enter data and clicks the submit button. The user is shown a specific screen .. And the input needs to be required. After the user clicks the button it also triggers a js function (which i will take care of) So clicking the submit button Triggers function in js Check if the field is filled out And shows some screen

+1

And that code looks like exactly what i asked for..? thanks really much both of you for the answers!

+1

so don't use <input type="submit"> but type="button"... with as 'value' attribute the button label ^^ Shreyash[90% Inactive] edit: no need to call event.preventDefault() if normal button

+1

+1

visph ohh... so you need preventDefault! Thanks! You taught me more :) Shreyash[90% Inactive] you're welcome! (Btw I can see you changed your username from 100% inactive to 90% inactive lol)

+1

TheCoder i am still active a bit of time but have wrote 100% so i changed leave it thanks for answering