java 使 <s:checkboxlist> 的选项在 struts2 中垂直显示

Making the options of a <s:checkboxlist> display vertically in struts2

提问by Sam

*I need my check box list option to display vertically instead of the default horizontal display.I have created a folder in my src folder in the name templates and another folder with name vertical-checkbox containing the modified .ftl file of my customized check box list.I am unable to display the customized check box My code in JSP is

*我需要我的复选框列表选项垂直显示而不是默认的水平显示。我在我的 src 文件夹中的名称模板中创建了一个文件夹，并在另一个文件夹中创建了一个名为 vertical-checkbox 的文件夹，其中包含我的自定义复选框的修改后的 .ftl 文件list.I 无法显示自定义复选框 我在 JSP 中的代码是

  <s:checkboxlist theme="vertical-checkbox" label="Which of the following are states of India"
                            name="states"
                                list="#{'01':'January','02':'February','03':'March','04':'April',
    '05':'May'}"
      />

Please advice where I am getting wrong.

请指教我哪里出错了。

回答by chandan sharma

Normally the struts checkboxlist in struts2 diaply the check boxes horizontally. In most of application we want to display the check boxes vertically (line by line). For aligning this as vertical we have to do the following

通常，struts2 中的 struts 复选框列表水平排列复选框。在大多数应用程序中，我们希望垂直（逐行）显示复选框。为了将其对齐为垂直，我们必须执行以下操作

1. You have to create a directory template in your src folder

2. Create a folder with the name of the template you want to create (vertical-checkbox)

3. Copy the struts-2.1.6/src/core/src/main/resources/template/simple/checkboxlist.ftl file to this directory content of this file is as follows. Before the you have to put a
   tag as you want or like this link: http://codeglobe.blogspot.com/2009/09/struts2-align-check-box-vertical.html

4. <s:checkboxlist list="urlist" name="selectedValues" listKey="id" listValue="descrption" theme="vertical-checkbox"></s:checkboxlist>

1. 您必须在 src 文件夹中创建一个目录模板

2. 使用要创建的模板的名称创建一个文件夹（垂直复选框）

3. 将struts-2.1.6/src/core/src/main/resources/template/simple/checkboxlist.ftl文件复制到该目录下，该文件内容如下。在您必须根据
   需要或喜欢此链接放置标签之前：http: //codeglobe.blogspot.com/2009/09/struts2-align-check-box-vertical.html

4. <s:checkboxlist list="urlist" name="selectedValues" listKey="id" listValue="descrption" theme="vertical-checkbox"></s:checkboxlist>

This will give you a vertical check box list. The only difference is that here you have to specify the theme which is same as the directory you have created in the template directory in the src folder of your project.

这将为您提供一个垂直的复选框列表。唯一的区别是这里你必须指定与你在项目的 src 文件夹中的模板目录中创建的目录相同的主题。

回答by Tobb

I tried the answer supplied here, but it did not work as I'd hoped, I lost the label on the list, and also other formatting disappeared. So, I did it through css:

我尝试了此处提供的答案，但没有如我所愿，我丢失了列表中的标签，并且其他格式也消失了。所以，我通过css做到了：

<s:checkboxlist
  name="myCheckboxList"
  ... />

which results in html-elements like this:

这导致像这样的 html 元素：

<input type="checkbox" id="myCheckboxList-1" ... />
<label for="myCheckboxList-1" ...
<input type="checkbox" id="myCheckboxList-2" ... />
<label for="myCheckboxList-2" ... 

The CSS for making the checkboxes vertical then looks like this:

使复选框垂直的 CSS 如下所示：

label[for*=myCheckboxList-]:after {
    content:"\A"; white-space:pre;
}

The selector states that "after each label with a for-attribute containing 'myCheckboxList-'", and the contents state "add a linebreak ("\A") and make sure that whitespaces are preserved".

选择器声明“在每个带有包含 'myCheckboxList-' 的 for 属性的标签之后”，内容声明“添加换行符（“\A”）并确保保留空格”。

回答by Accollativo

You can see here: http://klyuty.blogspot.it/2011/03/creating-vertical-orientation-for.htmlI think this is the simplest and clear way.

你可以在这里看到：http: //klyuty.blogspot.it/2011/03/creating-vertical-orientation-for.html我认为这是最简单明了的方法。

1. Create folder template in WEB-INF/classes folder of application.
2. Create folder simple in WEB-INF/classes/template folder (or another folder for other theme).
3. Copy file checkboxlist.ftl from struts2-core.jar library (that one, with located in simple theme folder in jar archive).
4. In this file after the closing of this label string (see the link for more detail):

1. 在应用程序的 WEB-INF/classes 文件夹中创建文件夹模板。
2. 在 WEB-INF/classes/template 文件夹（或其他主题的另一个文件夹）中创建文件夹 simple。
3. 从 struts2-core.jar 库中复制文件 checkboxlist.ftl（那个，位于 jar 存档中的简单主题文件夹中）。
4. 在此标签字符串关闭后的此文件中（有关更多详细信息，请参阅链接）：

for="${parameters.name?html}-${itemCount}" class="checkboxLabel">${itemValue?html}

and before string:

在字符串之前：

</@s.iterator>

add this (in between):

添加这个（中间）：

<#if parameters.cssStyle?exists>
<#if "${parameters.cssStyle?html}" == "vertical">
<br/><#rt/>
</#if>
</#if>

In this code "vertical" is css style, that we will use in strust2 page, and
is a separator between two checkboxes in our list.

在此代码中，“垂直”是 css 样式，我们将在 strust2 页面中使用它，并且
是列表中两个复选框之间的分隔符。

1. On struts2 page with s:checkboxlist use style "vertical" for make a vertical list orientation:

5. 在带有 s:checkboxlist 的 struts2 页面上，使用样式“垂直”来制作垂直列表方向：

回答by rappard

Without seeing the modified .ftl file it's difficult to tell where things go wrong, but the general solution is:

如果没有看到修改后的 .ftl 文件，很难判断哪里出了问题，但一般的解决方案是：

• Copy checkboxlist.ftl over to a new directory (e.g., .../template)

• In the copied file, add a break between the checkboxLabel class and the iterator:

  <label ... class="checkboxLabel">
  <br>
  </@s.iterator>
  

• Reference/include the new .../template/checkboxlist.ftl to override the standard checkboxlist.ftl.

• 将 checkboxlist.ftl 复制到新目录（例如，.../template）

• 在复制的文件中，在 checkboxLabel 类和迭代器之间添加一个中断：

  <label ... class="checkboxLabel">
  <br>
  </@s.iterator>
  

• 参考/包含新的 .../template/checkboxlist.ftl 以覆盖标准 checkboxlist.ftl。

If I recall correctly the above can also be done in CSS, but I forgot the details.

如果我没记错的话，上面也可以用 CSS 来完成，但我忘记了细节。

回答by ns123

see this website: http://mikeski.net/site/node/16

看到这个网站：http: //mikeski.net/site/node/16

basically, you just need to:

基本上，您只需要：

1. open up the file checkboxlist.ftl

2. it will contain 3 lines, the middle line uses the checkboxlist.ftl from the simple theme. Comment the line that says:

   <#include "/${parameters.templateDir}/simple/checkboxlist.ftl" />
   

3. Then copy the freemarker code that is referenced in the above URL.

1. 打开文件 checkboxlist.ftl

2. 它将包含 3 行，中间行使用简单主题中的 checkboxlist.ftl。评论说：

   <#include "/${parameters.templateDir}/simple/checkboxlist.ftl" />
   

3. 然后复制上述 URL 中引用的 freemarker 代码。

I did that, and it worked for me. It will display your checkbox on its own individual line.

我这样做了，它对我有用。它将在自己的单独行上显示您的复选框。