Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

defaultValue does not work with input when type is set to submit #14785

Open
jakubkosinski opened this issue Feb 7, 2019 · 2 comments
Open

Comments

@jakubkosinski
Copy link

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

When you use uncontrolled <input type="submit" /> and set defaultValue attribute, it would be ignored in versions 1.5.0 or higher (there would be no value attribute in the HTML result). It was working correctly in older versions. Looks like only type="submit" is affected, for other input types defaultValue behaves correctly.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:

Correct behaviour with react 16.4.2: https://codepen.io/anon/pen/zePmrZ
Incorrect behaviour with react 16.8.1: https://codepen.io/anon/pen/PVOyqV

What is the expected behavior?

When defaultValue="foo" is set on <input type="submit"/> it should result in <input type="submit" value="foo" /> in the HTML result.

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

All versions starting from 16.5.0

@augbog
Copy link

augbog commented Feb 7, 2019

Someone please correct me if I'm wrong but this might have been intentional? I was curious so stepping through the code, it looks like it bails out from setting the initial value in ReactDOMInput#postMountWrapper

    // Avoid setting value attribute on submit/reset inputs as it overrides the
    // default value provided by the browser. See: #12872
    if (isButton && (props.value === undefined || props.value === null)) {
      return;
    }

Looking at the #12872, it seems the reason for this is that the browser itself has a defaultValue (or label?) for these types (i.e. submit and reset). I guess this is a question of if these types should allow you to set a defaultValue?

@leonascimento
Copy link

leonascimento commented Feb 8, 2019

@augbog I agree with you, I tracked until seeing it code.

I'm thinking on this possible fix: when the input is a button, why not check if exists the _initialValue and assign it to node.value?

 if (_initialValue) {
   node.value = _initialValue;
 }

Something like it:

    var _initialValue = toString(node._wrapperState.initialValue);                                                                                                      
                                                                                                                                                                        
    // Avoid setting value attribute on submit/reset inputs as it overrides the                                                                                         
    // default value provided by the browser. See: #12872                                                                                                               
    if (isButton && (props.value === undefined || props.value === null)) {                                                                                              
      if (_initialValue) {                                                                                                                                              
        node.value = _initialValue;                                                                                                                                     
      }                                                                                                                                                                 
      return;                                                                                                                                                           
    } 

I did this local fix and is working here.
Guys if you agree with it, could I open a pull request?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants