Lea*_*ner 14 javascript java jquery jsp struts2
在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 />
Run Code Online (Sandbox Code Playgroud)
我运行程序,它实际上可以从右侧保存值.但是它没有显示保存的值.
我正在考虑使用javascript并使用onchange事件<s:optiontransferselect>来实现这一目标
<script>
function show(){
var 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>
Run Code Online (Sandbox Code Playgroud)
当我运行程序时,右侧仍然无法显示保存的值.
有关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;
}
}
Run Code Online (Sandbox Code Playgroud)
更新
我更改选项从 String到List<String>用适当的getter和setter.我运行代码,optiontransferselect仍然无法显示保存的值.
我做错了哪一部分?有人会告诉我吗?谢谢.
更新 我创建了一个新的jsp,例如success.jsp.如果我选择了一些值来选择选项并单击提交按钮.jsp文件可以显示我刚刚提交的值.我可以在数据库中看到保存的值.但是,optiontransferselect仍然无法显示已保存的值.
success.jsp有一个代码可以显示我刚刚提交的值.
Selected Value(s) : <s:property value="selectOption"/>
Run Code Online (Sandbox Code Playgroud)
在数据库中,我可以看到保存的值,所以我想知道如何让optiontransferselect显示保存的值?
另一个更新
我尝试selectedValues在提交之前使用按钮调用javascript函数来显示 .
<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()"/>
Run Code Online (Sandbox Code Playgroud)
我运行程序,当我按下按钮时,它可以在提交之前显示所选值,所以我仍然不明白为什么optiontransferselect无法保存所选值.
我认为为了解决您的问题,您需要了解两件事:
optiontransferselect运作。我从这个开始,因为这可能已经解决了你的问题。
为每个请求创建一个新的 Struts 操作实例。
这意味着当您将属性list(左侧)和doubleList(右侧)连接到派生类中的字段时ActionSupport- 就像上面的示例一样OptionTransferSelectAction- 您必须确保使用有意义的值初始化它,我的意思是反映当前的值您想要向用户显示的状态。在最坏的情况下,您必须在每次请求时从数据库中获取值。
或者,您可以将 bean 注入到具有专用生命周期的操作中(例如会话范围)。我可能会在另一篇文章中阐述这一点。
(顺便说一句,如果其他人可以提供更多信息,如果可以直接更改 Struts 操作的生命周期,我将不胜感激)。
optiontransferselect运作该标签包含两个select标签(或更具体地说是updownselect标签)。我先把它的功能列出来,因为这样可以让我们更好的理解optiontransferselect。(旁注:与 JSF 相反,Struts 明确区分了 get 和 set 操作的属性。)
要将select标签与基础数据连接起来,需要三个相关属性:
list- 这是所有可用值的列表(=get)。value- 这是最初选择的值列表(=get)。name-将在表单提交 (=set) 上提供所选值的操作的属性(字段)名称。因此,您的操作将收到的唯一属性是与 相关的属性name。该select标签不会...
list)回发给操作。list和的值。value对于 也是如此optiontransferselect。这使得语义相当奇怪,因为一些更改(即哪些值显示在左侧,哪些值显示在右侧)永远不会被回发到 Struts 操作,您只能获取两侧的选定值。
主要区别在于您现在两次拥有这三个属性:
list左侧和doubleList右侧。value左侧和doubleValue右侧。name左侧和doubleName右侧。现在的问题是如何才能只获得选定的值?我建议在提交之前自动选择它们:
<s:submit value="Save" onclick="selectAllOptions(document.getElementById('idLeft'));selectAllOptions(document.getElementById('idRight'));"/>
Run Code Online (Sandbox Code Playgroud)
其中对应的是optiontransferselect 中idLeft的值,对应的是 的值。通过这一更改,您将分别获得和中左值和右值的完整列表。ididRightdoubleIdnamedoubleName
该代码与您将使用的按钮完全相同,allowSelectAll="true"并且 JavaScript 方法selectAllOptions由 Struts 通过 提供optiontransferselect.js,无论 allowedSelectAll 为 true 或 false。