HTML Post with multiple pages

Skythrust

Skythrust

Member
Jul 9, 2019
133
7
Hi there,

I am developing a register page and I found some really interesting code from W3 Schools.

Only problem is, I would like to have a couple of inputs as requirements but not everything. First-/lastname are required and the mailaddress the rest not.

Can someone help me out with this question?
I have put the whole code in A pen
You must be registered for see links


Thanks in advance!
 
Sort by date Sort by votes
Hypothesis

Hypothesis

Programmer
Jan 6, 2019
524
361
Simply just add required to the end of each tag you want to be required, here's your codepen, I've added the required tag to the ones you stated.
You must be registered for see links
 
Upvote 0 Downvote
Skythrust

Skythrust

Member
Jul 9, 2019
133
7
Hypothesis said:
Simply just add required to the end of each tag you want to be required, here's your codepen, I've added the required tag to the ones you stated.
You must be registered for see links
Click to expand...

I see, but stille middlename is required if you try to click on next, same as the rest. It should like be something in the script but I can't delete that.
 
Upvote 0 Downvote
Higoka

Higoka

Active Member
Dec 16, 2018
174
74
in your js, change
JavaScript: 
if (y[i].value == "") {

to
JavaScript: 
if (y[i].value == "" && i !== 1) {

this will check if the input is empty and if its not the second field which in your case would be the middlename field
 
Upvote 0 Downvote
Skythrust

Skythrust

Member
Jul 9, 2019
133
7
Higoka said:
in your js, change
JavaScript: 
if (y[i].value == "") {

to
JavaScript: 
if (y[i].value == "" && i !== 1) {

this will check if the input is empty and if its not the second field which in your case would be the middlename field
Click to expand...

Thanks! This is the solution.

Next question about the multiple pages, in the code below he is showing some buttons after clicking on next. Only the type is not a submit type so I can't post my data.
Any idea how I can realise that?

JavaScript: 
function showTab(n) {
              // This function will display the specified tab of the form...
              var x = document.getElementsByClassName("tab");
              x[n].style.display = "block";
              //... and fix the Previous/Next buttons:
              if (n == 0) {
                document.getElementById("prevBtn").style.display = "none";
              } else {
                document.getElementById("prevBtn").style.display = "inline";
              }
              if (n == (x.length - 1)) {
                document.getElementById("nextBtn").innerHTML = "Submit";
              } else {
                document.getElementById("nextBtn").innerHTML = "Next";
              }
              //... and run a function that will display the correct step indicator:
              fixStepIndicator(n)
            }
 
Upvote 0 Downvote
Skythrust

Skythrust

Member
Jul 9, 2019
133
7
Higoka said:
just change <button type="button"> to <button type="submit">
Click to expand...
I had already tried that.

HTML: 
<button type="button" id="prevBtn" onclick="nextPrev(-1)">Previous</button>
 <button type="submit" id="nextBtn" onclick="nextPrev(1)">Next</button>

JavaScript: 
function showTab(n) {
              // This function will display the specified tab of the form...
              var x = document.getElementsByClassName("tab");
              x[n].style.display = "block";
              //... and fix the Previous/Next buttons:
              if (n == 0) {
                document.getElementById("prevBtn").style.display = "none";
              } else {
                document.getElementById("prevBtn").style.display = "inline";
              }
              if (n == (x.length - 1)) {
                document.getElementById("nextBtn").innerHTML = "Submit";
              } else {
                document.getElementById("nextBtn").innerHTML = "Next";
              }
              //... and run a function that will display the correct step indicator:
              fixStepIndicator(n)
            }

Thing is only, that the 'Next' button is the 'Submit' button
Post automatically merged:

Somebody any other idea's how I can fix it?
 
Last edited:
Upvote 0 Downvote

Users who are viewing this thread

Total: 2 (members: 0, guests: 2)
☀️  Switch to Light Theme

Latest posts

Top