Form validation javascript hiding elements

Question

I am building a form and alerting the user that they can not move to the next step until the input is successful

var location=document.getElementById("zip").value;
if(location==null || location==""){
    alert("Please insert a valid location!");
    return false;

}

If the user continues to the next step, the submit button is activated. If the user returns to this step, I want to hide the submit button only on this step if the same input is null. How can I do this using only javascript? The class of the submit button is 'btFinish'.

Thanks!

EDIT

I am using jQuery. I have tried

  $(btPrevious).click(function(e) {
                      $(btFinish).hide();
                    });

                  $(btNext).click(function(e) {
                      $(btFinish).show();
                    });

This hides the Finish button through the progression, but if there is an error in the input box, and the user clicks 'btNext', 'btFinish' will show even if the user must fix their input on the first step.

Evan · Accepted Answer · 2013-02-11 22:20:42Z

ok so from my understanding here you have two steps:

1) Zip must be filled in then user clicks to go to next step. 2) User can either submit finished or go back to the zip code step.

I would do something like this:

  $(btPrevious).click(function(e) {
      $(btFinish).hide();
  });

  $(btNext).click(function(e) {
      $(btFinish).show();
  });

  $('#zip').keyup(function(){
       if ($(this).val() === null || $(this).val() === ""){
            $(btFinish).hide();
       }
       else{
            $(btFinish).show();
       }
  });

this will prevent them from clicking on btFinish unless they have something written in the zip. I'm thinking that since they would hve to press the delete button, it should trigger the event handler. In the event that they can somehow elsewise clear the zip code, you could also check on blur or for whatever other event they can clear the box with.

xhallix · Accepted Answer · 2013-02-11 19:43:48Z

0

I would suggest you are trying something like that:

var location = document.formname.inputname.value;


if(location == ""){

    alert("No Valid Location")
}

answered Feb 11, 2013 at 19:43

xhallix

3,0115 gold badges40 silver badges57 bronze badges

Collectives™ on Stack Overflow

Form validation javascript hiding elements

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related