Welcome to Software Development on Codidact!

Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.

Post History

50%

+0 −0

Q&A Why would a form value inserted with value property won't be effective?

It works fine for me. Here's a minimal working example: <!DOCTYPE html> <html> <body> <form> <input type="text" name="field" id="field" value="old value"> <i...

posted 3y ago by Canina‭ · edited 3y ago by Canina‭

Answer

#2: Post edited by

Canina‭ · 2021-11-30T08:52:42Z (almost 3 years ago)

Copy Link

Raw

Markdown

It works fine for me.
Here's a minimal *working* example:
<!DOCTYPE html>
<html>
<body>
<form>
<input type="text" name="field" id="field" value="old value">
<input type="button" value="change"
onClick="document.querySelector('#field').value = 'new value';">
<input type="button" value="display"
onClick="alert(document.querySelector('#field').value);">
</form>
</body>
</html>
When I open that document in Firefox and simply click "display", "old value" is displayed. When I click "change" and then "display", "new value" is displayed. When I manually change the value in the input text field and click "display", the value I entered is displayed.
~~Therefore, what you are seeing is either something not mentioned at all in the question (such as perhaps a validation framework), or a bug in your browser. Take your pick as to which is more likely.~~
I recommend that you go back to the very basics, then work your way up to wherever the problem starts to happen. Whatever change you made last is then the cause of the problem.

It works fine for me.
Here's a minimal *working* example:
<!DOCTYPE html>
<html>
<body>
<form>
<input type="text" name="field" id="field" value="old value">
<input type="button" value="change"
onClick="document.querySelector('#field').value = 'new value';">
<input type="button" value="display"
onClick="alert(document.querySelector('#field').value);">
</form>
</body>
</html>
When I open that document in Firefox and simply click "display", "old value" is displayed in the alert popup. When I click "change" and then "display", "new value" is likewise displayed. When I manually change the value in the input text field and click "display", the value I entered is likewise displayed.
Therefore, what you are seeing is either something not mentioned at all in the question (such as perhaps a misused validation framework interfering with the update), or a bug in your browser. Take your pick as to which is more likely.
I recommend that you go back to the very basics, then work your way up to wherever the problem starts to happen. Whatever change you made last is then the cause of the problem.

#1: Initial revision by

Canina‭ · 2021-11-30T08:50:33Z (almost 3 years ago)

Copy Link

Raw

Markdown

It works fine for me.

Here's a minimal *working* example:

    <!DOCTYPE html>
    <html>
    <body>
    <form>
    <input type="text" name="field" id="field" value="old value">
    <input type="button" value="change"
      onClick="document.querySelector('#field').value = 'new value';">
    <input type="button" value="display"
      onClick="alert(document.querySelector('#field').value);">
    </form>
    </body>
    </html>

When I open that document in Firefox and simply click "display", "old value" is displayed. When I click "change" and then "display", "new value" is displayed. When I manually change the value in the input text field and click "display", the value I entered is displayed.

Therefore, what you are seeing is either something not mentioned at all in the question (such as perhaps a validation framework), or a bug in your browser. Take your pick as to which is more likely.

I recommend that you go back to the very basics, then work your way up to wherever the problem starts to happen. Whatever change you made last is then the cause of the problem.

Communities

Post History