如何在子流中包含弹出对话框 [英] How to include a pop-up dialog box in subflow

问题描述

有没有办法在子流状态中调用一个对话框，从而禁用背景(当前流)?

Is there a way to call a dialog box inside subflow state so that the background(current flow) becomes disabled?

这样当子流结束时(关闭弹出对话框后)，它可以更新父流(当前页面).

So that when the subflow ends (after closing the pop-up dialog box), it can then update the parent flow (current page).

我正在尝试使用子流实现如下图所示的内容:

I am trying to achieve something like the picture below with subflow:

更新:

最后我在webflow中使用以下代码动态生成对话框:

At the end I used the following code in webflow to dynamically generate dialog box on the go:

<render fragments="dialogContent"/>

推荐答案

我不认为 webflow parent -> subflow transitions 是为这样的问题设计的.Web 流程假定您正在从页面 -> 页面过渡.最好的办法是在弹出窗口初始化为父/主流程中定义的特定转换时进行 ajax/javascript 调用，并将要执行的逻辑放置在转换内.您可以将 Spring Webflow 配置为返回仅由您的 javascript 代码呈现的 html 片段.

I don't think webflow parent -> subflow transitions were design for such a problem. Web flow assumes you are transitioning from page -> page. Your best bet is to make ajax/javascript call while the pop up window is initializing to a specific transition defined in your parent/main flow and place the logic you want to execute inside the transition. You can configure Spring Webflow to return fragments of html that will only be rendered by your javascript code.

这是我的一个项目中的一个示例.

Here is an example from one of my projects.

  <view-state id="edit" view="flows/s/#{flowScope.modelPathName}/v/edit" model="modelObj">              
        <!--  NOTE: Inheriting flow must implement its own specific binding
        <binder>
            <binding property="name" /> 
            <binding property="description" />
        </binder> 
         -->

        <transition on="saveModel" to="chkLocalmodelObjDiff"/>
        <transition on="cancelSave" to="cancelEdit" bind="false"/> 
        <transition on="objUnlink">
            <set name="flashScope.viewResponse" value="pbmService.removeObjRelationship(requestParameters.objId,requestParameters.objName,modelObj)"/>

            <render fragments="view_response_msg" />
        </transition>

因此在上面的示例中，我们处于父/主"流程中.objUnlink"转换可以由如下所示的 html 链接触发.

so in the example above we are in our "parent/main" flow. the "objUnlink" transition can be triggered by either an html link that looks like this.

(sudo 代码网址):

${flowExecutionUrl}?_eventId='objUnlink'&someOtherParam=2

触发转换所需的参数是:"_eventId=objUnlink"

Required PARAM to Trigger the transition is: "_eventId=objUnlink"

或通过 ajax 调用，其中 url 的结构如下:

or via ajax call where the url is structured like this:

(sudo 代码网址):

${flowExecutionUrl}?_eventId='objUnlink'&someOtherParam=2&ajaxSource=true

通过 ajax 触发转换所需的参数是:"_eventId=objUnlink" 和 "ajaxSource=true"

Required PARAMs to Trigger the transition via ajax are: "_eventId=objUnlink" and "ajaxSource=true"

因为我们有:

<render fragments="view_response_msg" />

触发任一网址只会呈现您的视图定义的view_response_msg"片段.就我而言，我使用 thymeleaf 作为我的视图框架，并且view_response_msg"被定义为 thymeleaf 中的一个片段.

Triggering either url will only render the 'view_response_msg' fragment as defined by your view. In my case I am using thymeleaf as my view framework and 'view_response_msg' is defined as a fragment in thymeleaf.

因此，在发送请求并执行转换后，我的响应正文将仅包含在我的view_response_msg"中定义的渲染 html(而不是整个页面).

So after sending the request and executing the transition my response body will only consist of the rendered html that was defined in my 'view_response_msg' (and not the entire page).

因此对于您的用例，您应该:

So for your use case you should:

1. 在您的视图框架中定义一个片段，它只会呈现弹出窗口的内容.为了与我们的示例保持一致，将其称为view_response_msg"

1. Define a fragment in your view framework that will only render the contents of the pop up window. To stay consistent with our example will call it 'view_response_msg'

然后通过 AJAX 调用父/主流上的特定转换.再次保持一致将称之为'objUnlink'

Then call a specific transition on the parent/main flow via AJAX. Again to stay consistent will call it 'objUnlink'

然后将此部分呈现的 html 响应存储在一个 javascript 变量中(请记住，我们将这种转换称为 ajax 调用)，然后将其显示在您的弹出窗口中.

Then store this partially rendered html response in a javascript variable (remember we called this transition from ajax call) and then display it inside your pop up.

如果您想在有人关闭弹出窗口时更新父/主流程，请使用相同的概念并创建另一个 ajax 调用 -> 过渡 -> 片段渲染.请记住，我们还没有离开主流.

If you want to update the parent/main flow when some one closes the pop up use the same concept and create another ajax call -> transition -> fragment render. Remember we have not left the main flow.

抱歉回答太长，但这不是一个小问题:)

Sorry for the long answer but it is not a trivial problem :)

注意: Spring Web Flow 必须明确配置为处理 ajax 请求.请参阅文档.此外，您的特定视图框架(例如 thymeleaf)可能有自己的特定配置/实现，用于 Web Flow 来处理 ajax 请求和呈现片段.

Note: Spring Web Flow must be EXPLICITLY configured to handle ajax requests. See the documentation. Moreover, your specific view framework might (e.g thymeleaf) has it's own specific configuration/implementation for Web Flow to handle ajax requests and for rendering fragments.

这篇关于如何在子流中包含弹出对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！