controlled components made uncontrolled

[hallgren]

Is there any way that a controlled component can be updated or made uncontrolled?

For example the <input type="submit" value="Send"/> will not update its value on a new value on render.

[ssorallen]

I changed that in a pull request that was merged to master, but the commits have not yet been included in a release: #15

The PR also changed checked to defaultChecked for the same reason you mentioned.

[Daniel15]

Are you using react-magic or HTMLtoJSX?

Thanks for the reminder @ssorallen, I'll cut a release shortly. I was going to bundle some other bug fixes but I can do those separately.

[Daniel15]

Just pushed out an update to HTMLtoJSX. As for react-magic, it should already be up to date.

[ssorallen]

@Daniel15, where does HTMLtoJSX live? I thought it was part of react-magic.

[Daniel15]

HTMLtoJSX is the package on NPM, and is one portion of react-magic. It handles converting HTML to JSX, that's it.

React-magic is HTMLtoJSX + automatically converting the whole page to a React component + handling AJAX loading page transitions (ie. clicking URLs). React-magic is more experimental :P

The readme in this repo explains what react-magic is, whereas README-htmltojsx.md (and the readme on NPM) explain HTMLtoJSX.

[Daniel15]

In short, this is react-magic: https://github.com/reactjs/react-magic/blob/master/src/magic.js

[ssorallen]

Cool, thanks for the explanation. I see the new 0.2.1 package on NPM.

[hallgren]

defaultValue will not work on all types including type="submit" according to the react team it´s a button and not editable by a user. ref: facebook/react#2673 (comment)

Is it possible to work around this in HTMLtoJSX? I think and I have the issue that a submit button value can change between two diffing HTML elements.

[ssorallen]

Good point on the value of a <input type="submit">. It seems to work fine setting defaultValue though, even if it's not semantically meaningful.

[Daniel15]

If setting defaultValue rather than value on buttons doesn't work properly, I'd suggest opening a separate issue for it. Thanks!

[ssorallen]

@hallgren Aha, I see what you mean by the problem now. First page has an <input type="submit" value="Submit"> and the second one has <input type="submit" value="Click Me">, and the value would not be reflected in the rendered DOM because HTMLtoJSX is setting defaultValue instead of value.

[hallgren]

I don´t know if it´s possible to update the value on the submit button due to how react.js handles the <input type="submit"> button component.

It work for the <button type="submit">text</button> tag.