Change value of input after it has been clicked – jQuery (like stackoverflow review question)

<form action="http://www.google.com/">
  <textarea name="text"></textarea>
  <input type="submit" name="review" value="Review" />
</form>

This is my basic form I am trying to replicate the stackoverflow review your question feature with.

To do this I am using the following jQuery:

$(function(){
  let hasUserReviewedTheForm = false;
  $('form').submit(function(){
    if(!hasUserReviewedTheForm) { // Review the form
      $('html, body').animate({scrollTop : $(".Anchor").offset().top}, 300); // anchor
      hasUserReviewedTheForm = true; // Has clicked Once
      return false; // Cancel form action
    } else { 
      // Submit the form
    }
  });
});

Being inside of the submit function, the else statement would not be a place to change the text. So I tried placing the if condition around the function, which made the submit never return true.

I then tried creating a separate if condition outside of the function like so:

$(function() {
  let hasUserReviewedTheForm = false;
  if(hasUserReviewedTheForm) {
    $('input.review').val('Submit');
  }

  $('form').submit(function(){
    if(!hasUserReviewedTheForm) { // Review the form
      $('html, body').animate({scrollTop : $(".Anchor").offset().top}, 300);
      hasUserReviewedTheForm = true;
      return false; // return false to cancel form action
    } else { // Submit the form
          
    }
  });
});

That also had no effect, I'm not sure where to go with this.

How can I change the value of my submit after it has been clicked?

I have a live demo here on CodePen



Read more here: https://stackoverflow.com/questions/64950632/change-value-of-input-after-it-has-been-clicked-jquery-like-stackoverflow-rev

Content Attribution

This content was originally published by GiЯ at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: