我有一个登录表单,标记如下:
<div id="login_form" hx-ext="response-targets">
<form action="/login" method="POST" hx-boost="true" hx-target="#login_form" hx-target-400="#login_form" hx-swap="innerHTML">
...
<button type="submit">Log in</button>
</form>
</div>
当出现错误时,Backend返回带有概述错误的表单,状态代码为400(因此扩展为response-targets
).在成功,后端响应HX-Location
标题的用户的个人资料页面,我希望用户被重定向.简单地说:
- 出错时应重新呈现表单(400个错误请求)
- 用户应在成功(200 OK)后被重定向至其个人资料页面
实际发生的情况是,HTMX以#login_form
为单位呈现整个用户的个人资料页面,而不是重定向,就好像hx-target
覆盖或优先于HX-Location
标头.
试着在没有response-target
插件的情况下,它的工作原理是一样的.对于response-target
插件,我不能省略hx-target
,因为hx-target-400
不能被识别或处理.
我如何将它们组合在一起,以便在出错时重新呈现表单,或在成功时重定向到页面?