CODEWITHSUNDEEP
javascriptjqueryreactjsonchange
Ilario Engler
Ilario Engler

Reputation: 2469

react.js change input value with javascript

I would like to change the values with javascript/jquery but when I hit submit, the old initial values are used and not my new ones.

I cannot change the react code, I can only change the values with javascript/jquery as shown below.

var value = "randomIntValue";
$("input[data-reactid='.0.2.0.0.0.0.0.2.0.0.3.0.3.0.0']").val(value).change();

The above code doesn't work!

Upvotes: 2

Views: 1804

Answers (1)

Chris
Chris

Reputation: 59491

From what I can gather from the comments above, the problem you're having is that you're trying to change a React-controlled component through jQuery.

This is not possible because you cannot update the React state from the view directly. When you run your jQuery code, the changes are only temporarily applied to the DOM, but React does not know about this. As such, when React needs to re-render the view the old values in the DOM will be overwritten.

Also, accessing the component via the data-reactid is a bad approach because the value is likely to change if any changes are made the React virtual-DOM.

Using React and jQuery is usually a bad idea when trying to apply DOM changes. If you cannot access/change any React code, I'm afraid you're out of luck.

Upvotes: 3

Related Questions