Html 动态创建和提交表单

我在我的模型中有一些数据，我想把它们放在一个请求体中，并随POST请求一起发送。问题是我希望浏览器导航到请求URL，因为路由返回一个新的HTML页面。通常，这将通过将数据放入表单中，然后使用JS提交来完成

---

如何使用Elm进行编辑？

编辑-根据您的评论说明进行更新

我理解你的问题，你希望能够在幕后构造一个POST请求，但让浏览器发布它，以便浏览器重定向到它发布的实际页面，而将你的Elm应用留在后面

您可以在Elm中构建表单，但将其隐藏，然后当您想要触发它时，将表单ID传递给执行表单提交的端口

类型别名模型=
{foo:String}
视图模型=
分区[]
[Html.form]
[id“我的表格”
“行动”https://requestb.in/1crya751"
，方法“POST”
，样式[（“显示”、“无”）]
]
[输入[输入文本”，名称“foo”，值model.foo][]
]
，分区[]
[按钮[单击提交表单][文本“提交”]]
]
输入味精
=提交形式
更新msg模型=
味精案例
提交格式->
模型[提交表格“我的表格”]
端口提交格式：字符串->命令消息

您的javascript可能看起来像这样（尽管在id不存在的情况下会有一些错误处理）：

var-app=Elm.Main.fullscreen（）
app.ports.submitForm.subscribe（函数（formId））{
document.getElementById（formId.submit（）；
});

这是一本书。它将表单发布到requestb.in，以便您可以查看已发布的内容

---

我之所以建议使用隐藏表单而不是尝试使用标准的

Http

包，是因为听起来您希望浏览器重定向到您发布到的任何表单。使用

Http

软件包无法实现同样的效果。

编辑-根据您的评论说明进行更新

我理解你的问题，你希望能够在幕后构造一个POST请求，但让浏览器发布它，以便浏览器重定向到它发布的实际页面，而将你的Elm应用留在后面

您可以在Elm中构建表单，但将其隐藏，然后当您想要触发它时，将表单ID传递给执行表单提交的端口

类型别名模型=
{foo:String}
视图模型=
分区[]
[Html.form]
[id“我的表格”
“行动”https://requestb.in/1crya751"
，方法“POST”
，样式[（“显示”、“无”）]
]
[输入[输入文本”，名称“foo”，值model.foo][]
]
，分区[]
[按钮[单击提交表单][文本“提交”]]
]
输入味精
=提交形式
更新msg模型=
味精案例
提交格式->
模型[提交表格“我的表格”]
端口提交格式：字符串->命令消息

您的javascript可能看起来像这样（尽管在id不存在的情况下会有一些错误处理）：

var-app=Elm.Main.fullscreen（）
app.ports.submitForm.subscribe（函数（formId））{
document.getElementById（formId.submit（）；
});

这是一本书。它将表单发布到requestb.in，以便您可以查看已发布的内容

---

我之所以建议使用隐藏表单而不是尝试使用标准的

Http

包，是因为听起来您希望浏览器重定向到您发布到的任何表单。通过使用

Http

软件包，你无法真正实现同样的目标。

如果有办法让问题的作者知道你为什么认为这个问题不好。。。不幸的是，你唯一能做的就是按下“关闭”按钮。从elm-lang.org fo到“Docs”>“elm简介”。最终您将访问“HTTP”。从这里，您将阅读有关Http模块的内容，@z5h查看此问题的答案，以了解Http模块为什么没有帮助。如果有办法让问题的作者知道您为什么认为此问题不好。。。不幸的是，你唯一能做的就是按下“关闭”按钮。从elm-lang.org fo到“Docs”>“elm简介”。最终您将访问“HTTP”。从这里，您将阅读有关Http模块的内容。@z5h请查看此问题的答案，以了解为什么Http模块没有帮助。嗯，差不多了。问题是我想以编程方式提交它（我还想将它的数据设置为其他内容）。我猜，既然在Elm中没有办法做副作用的事情，我唯一的选择就是用JS编写这段代码，然后使用端口调用它，对吗？我已经根据您的澄清更新了答案。谢谢。好吧，差不多了。问题是我想以编程方式提交它（我还想将它的数据设置为其他内容）。我猜，既然在Elm中没有办法做副作用的事情，我唯一的选择就是用JS编写这段代码，然后使用端口调用它，对吗？我已经根据您的澄清更新了答案。谢谢。太好了