How to make input valid with js?

Question

I have a required input :

<input type="text" id="input-id" required>

When user submit it I send its value with ajax and then clear it with $("#input-id").val("").
After it input becomes invalid, but I want to make it looks like it did right after page loading. How can I do it with js? Maybe I should clear input in another way?

I think I may have misunderstood what you wanted. What value did the input text have before the ajax, and what does it have afterwards? — Sharon
– Sharon, Commented Aug 15, 2019 at 12:05

Omri Attiya · Accepted Answer · 2019-08-15 11:38:24Z

4

Try to do what's written here:

document.getElementById(selector).reset();

if you want to reset a particular field, try use defaultValue:

function reset() {
  field = document.getElementById('field');
  field.value = field.defaultValue;
}

<input id="field" type="text" required>
<button onclick="reset()">reset field</button>

Another solution will be to define a form within a form, that contains only the fields you want to reset, and then reset the inner form.

edited Aug 15, 2019 at 11:38

answered Aug 15, 2019 at 11:26

Omri Attiya

4,0473 gold badges22 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

DeadUnicorn Over a year ago

It only works with forms whereas I want to apply it to input

Omri Attiya Over a year ago

@DeadUnicorn you are right, I edited the answer, check if it's working for you

DeadUnicorn Over a year ago

It has the same effect as $(selector).val(""). Field becomes invalid after it

Omri Attiya Over a year ago

@DeadUnicorn read about the form within a form solution I suggested

Sharon · Accepted Answer · 2019-08-15 11:38:48Z

1

$(document).ready(function () {
   $("#input-id").val("");
   //If you also want to set innerText:
   var ele = document.getElementById('input-id');
   ele.innerText= $("#input-id").val();
};

As soon as the document is ready (the page is loaded) then the input becomes invalid. Place this wherever you think is appropriate.

edited Aug 15, 2019 at 11:38

answered Aug 15, 2019 at 11:27

Sharon

13816 bronze badges

3 Comments

DeadUnicorn Over a year ago

The problem is to make it valid after $("#input-id").val("") (without putting text inside of it)

Sharon Over a year ago

@DeadUnicorn Just to clarify, did you care only about val() or also about innerText?

Sharon Over a year ago

@DeadUnicorn added an innerText thing too if that's what you wanted?

Collectives™ on Stack Overflow

How to make input valid with js?

2 Answers 2

4 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related