In AMP Form, I am trying to fill in a hidden input field based on a form response. The response is an array inside of a JSON object. When I try to pull in the information into a div's [text] attribute, it works. But in the input's [value] attribute, it won't.
Here's my sample code:
<form method="post" action-xhr="submit.php" target="_top"
on="submit-success: AMP.setState({answer:{display:event.response.answer}})">
<div id="response" [text]="answer.display.concat()"></div>
<input type="text" name="answer" value="" required>
<input type="hidden" name="active" value="" [value]="answer.display.concat()" />
<input type="submit" value="Submit" />
</form>
After I submit, the div with id "response" will display the event.response.answer
information but the hidden input's value will not change.
However, if I change the answer.display
variable into a string instead of an array, the input's value will work. For example, this works as expected:
<form method="post" action-xhr="submit.php" target="_top"
on="submit-success: AMP.setState({answer:{display:'foobar'}})">
<div id="response" [text]="answer.display"></div>
<input type="text" name="answer" value="" required>
<input type="hidden" name="active" value="" [value]="answer.display" />
<input type="submit" value="Submit" />
</form>
So why doesn't concat()
work inside of an input's value
attribute even though it will work with a div's text
attribute?
And maybe more importantly, how can I use the form's response in my form so that it can be submitted again?