如何在将表单提交到第 3 方 url 之前调用服务器端操作方法？

Question

好的，我正在使用 Spring Webflow，我目前有一个涉及两个 jsp 页面（视图）的流程，其中第二个页面将表单提交给第 3 方系统（付款）。

在我的 pay-flow.xml 我有这样的状态；

<!-- Initial state, the jsp(view) gathers the number of items to purchase -->
<view-state id="buy" view="credit/buy" model="credit">
    <transition on="submit" to="createTrans" />
</view-state>

<!-- State not tied to a jsp, saves the "credit" object to the database -->
<action-state id="createTrans">
   <evaluate expression="creditAction.saveTrans(credit)"/>
   <transition to="wpRedirect"/>
</action-state>

<!-- Gathers some more info & has a form that submits to the 3rd party system -->
<view-state id="wpRedirect" view="credit/redirect">
    <transition on="accepted" to="showInvoice" history="invalidate">
    <evaluate expression="creditAction.reloadTrans(credit)" result="credit" />
</transition>
</view-state>

如你所见，流程基本上是这样的；
1) 显示第一个 jsp，用户输入一些详细信息，提交表单
2）后台保存模型对象到数据库
3) 显示第二个 jsp，用户输入更多详细信息并提交表单
4) 表单提交到第 3 方 URL，用户与第 3 方系统交互
5) 最终，第 3 方重定向回流程
6) 在“接受”响应时，重新加载之前保存的模型对象

我想要做的是将两个jsps合并到一个视图中，并且基本上将这三个状态浓缩为一个。我有一些 javascript 和表单控件来收集所有信息。

问题是，我怎样才能仍然将表单提交到第 3 方 URL，但在此之前，仍然在服务器端调用“creditAction.saveTrans(credit)”？显然这需要对用户透明，他们应该对页面现在合并感到高兴，但仍然只需要在最后单击“提交”并在他们不知情的情况下完成所有后台保存和加载。

我在想我可以在提交按钮上放置一个 onclick，使其只是一个普通按钮，然后从 javascript 提交表单，类似于以下内容，但是我如何调用我的服务器端代码以将模型基本上保存在.submit() 之前的行？

function submitform() {
    <!-- call creditAction.saveTrans(credit) somehow??? -->
    document.forms["myform"].submit();
}

Answer 1

你有两个选择：

1）使用JavaScript改变表单的目标和动作，提交到隐藏的IFrame，提交，然后改回正常再次提交。

2) 使用AJAX提交，然后正常提交表单。