无法在表单提交成功事件AMP上设置状态 [英] unable to setState on form submit-success event AMP
问题描述
当我在submit-success事件上提交表单时，我试图提交另一张表单，但是会导致信任级别错误，表明submit-success没有相同的信任级别来设置状态.我检查了amp-form提交事件和setState事件具有与HIGH相同的信任级别，但是没有找到提交成功事件的信任级别
when i am submitting a form on the submit-success event i am trying to submit another form but it results in an trust level error stating that the submit-success does not have the same level of trust to set the state. I checked that amp-form submit event and setState event have same trust level as HIGH but didnt find the trust level for submit-success event
"submit-success" event with "low" trust is not allowed to invoke "amp.setState".
虚拟示例
<form id="f1" method="POST" xhr-action="dummyapi" on="submit-success:AMP.setState({dummy:true})">
<!--fields-->
</form>
<form id="f2" method="POST" xhr-action="dummyapi" on="submit-success:f1.submit">
<!--fields-->
</form>
表单f1提交时的setState无法工作
the setState on submit of form f1 wont work
推荐答案
好友，您的代码在哪里?为什么不能插入简单的有效AMP模板?您可能希望有人为您做任何事情，但这不会总是发生.
Buddy, where's your code? Why can't you insert a simple valid AMP template? You probably expect someone to do everything for you, but this will not always happen.
我试图做你写的事情，一切对我都有用，
I tried to do what you wrote and everything works for me, look:
<!--
This is the minimum valid AMP HTML document. Type away
here and the AMP Validator will re-check your document on the fly.
-->
<!DOCTYPE html>
<html ⚡>
<head>
<meta charset="utf-8" />
<link rel="canonical" href="self.html" />
<meta name="viewport" content="width=device-width,minimum-scale=1" />
<style amp-boilerplate>
body {
-webkit-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
-moz-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
-ms-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
animation: -amp-start 8s steps(1, end) 0s 1 normal both;
}
@-webkit-keyframes -amp-start {
from {
visibility: hidden;
}
to {
visibility: visible;
}
}
@-moz-keyframes -amp-start {
from {
visibility: hidden;
}
to {
visibility: visible;
}
}
@-ms-keyframes -amp-start {
from {
visibility: hidden;
}
to {
visibility: visible;
}
}
@-o-keyframes -amp-start {
from {
visibility: hidden;
}
to {
visibility: visible;
}
}
@keyframes -amp-start {
from {
visibility: hidden;
}
to {
visibility: visible;
}
}
</style>
<noscript>
<style amp-boilerplate>
body {
-webkit-animation: none;
-moz-animation: none;
-ms-animation: none;
animation: none;
}
</style>
</noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
</head>
<body>
<h2>First form</h2>
<form id="secondForm" method="post" target="_top" action-xhr="https://amp.dev/documentation/examples/api/echo">
<input type="hidden" value="hiddenValue">
<div submit-success>Second form send successful!</div>
<div submit-error>Second form send failed!</div>
</form>
<hr>
<h2>Second form</h2>
<form id="firstForm" method="post" target="_top" action-xhr="https://amp.dev/documentation/examples/api/verify-form-input-text-xhr" on="submit-success:secondForm.submit">
<button type="submit">Submit</button>
<div submit-success>First form send successful!</div>
<div submit-error>First form send failed!</div>
</form>
</body>
</html>Codepen:: https://codepen.io/alexandr-kazakov/pen/wvGJvzJ?editors = 1000
这篇关于无法在表单提交成功事件AMP上设置状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
