struts2 optiontransferselect 从数据库中检索和显示值

Question

在 jsp 页面中，我有一个 <s:optiontransferselect> 用于在左侧和右侧之间交换值和一个提交按钮来保存。

<s:optiontransferselect 
    allowUpDownOnLeft="false"
    allowUpDownOnRight="false"
    allowSelectAll="false"
    allowAddAllToLeft="false"
    allowAddAllToRight="false"
    addToRightLabel="Go to right"
    addToLeftLabel="Go to left" 
    leftTitle="Left side values"
    headerKey="0"
    name="option"
    list= "optionList"
    rightTitle="Right side values"
    doubleHeaderKey="0"
    doubleList="selectedOptionList" 
    doubleName="selectOption"
    doubleId="selectedValues"
>
</s:optiontransferselect>

<s:submit />

我运行程序，它实际上可以保存右侧的值。但是它不会在那里显示保存的值。

我正在考虑使用 javascript 并在 <s:optiontransferselect> 中使用 onchange 事件来实现此目的

<script>
    function show(){
        const list = document.getElementById("selectedValues");
        for (var i = 0; i < list.options.length; i++) {
        //seems something not correct in this part but I am not sure how solve in this way 
            list.options[i].selected = true;
        }
        return true;
    }
</script>

<s:optiontransferselect 
    allowUpDownOnLeft="false"
    allowUpDownOnRight="false"
    allowSelectAll="false"
    allowAddAllToLeft="false"
    allowAddAllToRight="false"
    addToRightLabel="Go to right"
    addToLeftLabel="Go to left" 
    leftTitle="Left side values"
    headerKey="0"
    name="option"
    list= "optionList"
    rightTitle="Right side values"
    doubleHeaderKey="0"
    doubleList="selectedOptionList" 
    doubleName="selectOption"
    doubleId="selectedValues"
    onchange ="show()" <!-- onchange seems not work here -->
> 
</s:optiontransferselect>

当我运行程序时，右侧仍然无法显示保存的值。

有关 optiontransferselect 的更多信息，以防它有用。

我有一个动作类。

public class OptionTransferSelectAction extends ActionSupport {
    private List<String> optionList;
    private List<String> selectedOptionList;
    //private String option;
    private  List<String> option;
    private List<String> selectOption;

    public OptionTransferSelectAction (){
        optionList=new ArrayList<String>();
        //display on the left side for selection
        optionList.add("Section A");
        optionList.add("Section B");
        optionList.add("Section C");
        optionList.add("Section D");
        optionList.add("Section E");
        optionList.add("Section F");
        optionList.add("Section G");
        optionList.add("Section H");

        selectedOptionList=new ArrayList<String>();
        //display on the right side
        //pretend it does not have any values in the first time (does not 
        //trigger the save yet)
        
    }   

    public List<String> getOptionList() {
        return optionList;
    }

    public void setOptionList(List<String> optionList) {
        this.optionList = optionList;
    }

    public List<String> getSelectedOptionList() {
        return selectedOptionList;
    }

    public void setSelectedOptionList(List<String> selectedOptionList) {
        this.selectedOptionList = selectedOptionList;
    }
    /*
    public String getOption() {
        return option;
    }

    public void setOption(String option) {
        this.option = option;
    }
    */
    public List<String> getOption() {
        return option;
    }

    public void setOption(List<String> option) {
        this.option = option;
    }


    public List<String> getSelectOption() {
        return selectOption;
    }

    public void setSelectOption(List<String> selectOption) {
        this.selectOption = selectOption;
    }
}

更新

我使用正确的 getter 和 setter 将选项从 String 更改为 List<String>。我运行代码，optiontransferselect 仍然无法显示保存的值。

我做错了哪一部分？有人可以告诉我吗？谢谢。

更新 例如，我创建了一个新的 jsp，success.jsp。如果我选择了一些值来选择选项并单击提交按钮。 jsp文件可以显示我刚刚提交的值。我可以看到数据库中保存的值。但是 optiontransferselect 仍然无法显示保存的值。

success.jsp 有一段代码可以显示我刚刚提交的值。

Selected Value(s) : <s:property value="selectOption"/>

在数据库中，我可以看到保存的值，所以我想知道如何让optiontransferselect显示保存的值？

另一个更新

我尝试使用按钮调用 javascript 函数在提交前显示selectedValues。

<script>
    function testshow() {
        var value = document.getElementById("selectedValues");
        for(var i=0;i<value.options.length; i++) {
            alert(value.options[i].innerHTML);
        }
        return true;
    }
</script>

//button to call the function
<s:submit onclick="return testshow()"/>

我运行程序，当我点击按钮时，它可以在提交之前显示选择的值，所以我仍然不明白为什么optiontransferselect无法获取保存的选择值。

Answer 1

我认为您需要了解两件事才能解决您的问题：

1. Struts 操作的生命周期。
2. optiontransferselect 的实际工作原理。

---

Struts 动作的生命周期

我从这个开始，因为这可能已经解决了你的问题。

? 为每个请求创建一个新的 Struts 动作实例。

这意味着当您将属性 list（左侧）和 doubleList（右侧）连接到派生自 ActionSupport 的类中的字段时 - 就像上面的示例 OptionTransferSelectAction 一样 - 您必须确保，你用有意义的值初始化它，我的意思是反映你想向用户显示的当前状态的值。在最坏的情况下，您必须随每个请求从数据库中获取值。

或者，您可以将 bean 注入具有专用生命周期的操作（例如会话范围）。我可能会在单独的帖子中说明这一点。

（顺便说一句，如果其他人可以提供更多信息，如果可以直接更改 Struts 操作的生命周期，我将不胜感激）。

---

optiontransferselect 的工作原理

这个标签包含两个select 标签（或者更具体地说是updownselect 标签）。我先列一下它的作用，因为它让我们更好地理解optiontransferselect。 （旁注：与 JSF 不同，Struts 清楚地区分了 get 和 set 操作的属性。）

要将select标签与底层数据连接起来，有以下三个相关属性：

1. list - 这是所有可用值的列表（=get）。
2. value - 这是最初选择的值列表 (=get)。
3. name - 将在表单提交 (=set) 时提供 选定值 的操作的属性（字段）名称。

因此，您的操作将收到的唯一属性是与name 关联的属性。 select 标签不会...

• ...将完整的值列表（list 的值）发回操作。
• ...更改底层 Java 类/操作中 list 和 value 的值。

optiontransferselect 也是如此。这使得语义非常奇怪，因为某些更改（即哪些值显示在左侧，哪些值显示在右侧）将永远不会回传到 Struts 操作，您只能获取 selected 双方的价值观。

主要区别在于你现在拥有这三个属性两次：

1. list --> list 用于左侧，doubleList 用于右侧。
2. value --> value 用于左侧，doubleValue 用于右侧。
3. name --> 左侧为name，右侧为doubleName。

现在的问题是如何得出您只会获得 selected 值？我建议在提交之前自动选择它们：

<s:submit value="Save" onclick="selectAllOptions(document.getElementById('idLeft'));selectAllOptions(document.getElementById('idRight'));"/>

其中idLeft对应optiontransferselect中id的值，idRight对应doubleId的值。通过该更改，您将分别获得 name 和 doubleName 中左右值的完整列表。

代码与使用allowSelectAll="true" 获得的按钮完全相同，并且JavaScript 方法selectAllOptions 由Struts 通过optiontransferselect.js 提供，无论allowSelectAll 是真还是假。