在struts2中使用s:checkboxlist显示基于选择多个复选框的结果

Question

我有一个如下的复选框列表：

<s:checkboxlist list="books" name="checked" theme="simple" cssStyle="vertical"                      
listKey="code" listValue="description" >    </s:checkboxlist> 
<s:submit value="submit" name="submit"/>

我有诸如学术、小说、烹饪食谱等复选框。也就是说，有多个复选框，我可以从中选择多个选项。比如说，我选择小说和学术，那么小说和学术下的所有书籍都应该显示出来。如果我只选择小说，则只需显示小说类别下的书籍。我想要一个提交按钮，单击该按钮时会根据所选类别列出所有书籍。

当我尝试在 checkboxlist 中使用 onchange 函数时（如下所示的第二个代码），它不适用于多项选择，即，只要我选中一个复选框（例如，小说），页面就会自动刷新在我检查其他复选框并仅显示该特定类别（即小说）下的书籍之前。因此，以下内容不允许我选中多个复选框。还有其他方法可以实现吗？

<s:checkboxlist list="books" name="checked" theme="simple" cssStyle="vertical"                      
listKey="code" listValue="description" onchange="searchBook(this)" >    </s:checkboxlist> 


function searchBook(book){
var bookValue   = book.value;
document.getElementById("book").value = bookValue;     
document.forms[0].submit();
}

谢谢！

Answer 1

 <s:checkboxlist list="books" name="checked" theme="simple" cssStyle="vertical"  
listKey="code" listValue="description" onchange="searchBook(this)" >    </s:checkboxlist>

您可以使用onchange 或onclick

var lastVal = ""; // globale variable
    function searchFunction(){
        var checkboxes = document.getElementsByName('checked');
        var vals = "";
        for (var i=0, n=checkboxes.length;i<n;i++) {
          if (checkboxes[i].checked) 
          {
          vals += ","+checkboxes[i].value;
          }
        }
        if (vals) vals = vals.substring(1);
        if(vals != "" && lastVal != vals){
            lastVal = vals;
            document.getElementById("book").value = vals;     
            document.forms[0].submit();
        }

    }