創建一個可重用的Bootstrap「摺疊按鈕」作爲Java Tapestry組件

我的項目使用許多Bootstrap「摺疊」按鈕來顯示&隱藏內容。結構是一致的，所以我認爲這是一個很好的候選者，可以變成一個組件。創建一個可重用的Bootstrap「摺疊按鈕」作爲Java Tapestry組件

的結構是這樣的：

<button type="button" class="btn btn-toggle pull-right" data-toggle="collapse" data-target="#name_of_div_to_collapse"> 
<span class="caret"></span> 
</button> 

<div id="#name_of_div_to_collapse" class="btn_collapse"> 
Content to show and hide when the collapse button is toggled 
</div>

我想談談整個按鈕爲可重用的組件，但我不能工作了，我怎麼能這樣做的同時，指定所需的唯一數據-target #name_of_div_to_collapse爲按鈕的每個實例。這可能使用Tapestry？我可以傳遞一個參數來指定我稱之爲組件的TML中的數據目標名稱嗎？

更新：

我現在可以使用下面的代碼唯一的數據目標打印按鈕。我無法解決的是如何將跨度插入符插入MarkupWriter生成的標記中。

TML：

<t:frontend.CollapseButton dataTarget="literal:#check_cases_collapse"/>

的Java：

@SupportsInformalParameters 
public class CollapseButton { 

@Parameter(required=true, allowNull=false, defaultPrefix=BindingConstants.ASSET) 
private String dataTarget; 

@Inject 
private ComponentResources resources; 

boolean beginRender(MarkupWriter writer) 
{ 
    writer.element("button", "data-target", dataTarget, "class", "btn btn-toggle pull-right", "type", "button", "data-toggle", "collapse"); 
    resources.renderInformalParameters(writer); 
    writer.end(); 
    return false; 
} 

}

這產生如下的輸出，這幾乎是我想要的：

<button data-toggle="collapse" type="button" class="btn btn-toggle pull-right" data-target="#check_cases_collapse"></button>

但我不能工作，如何使用MarkupWriter在按鈕HTML內插入跨度插入符號。任何人？

來源

2013-10-04 Ila

事實證明，MarkupWriter接受嵌套標記。爲Java類的最後工作的代碼是：

@SupportsInformalParameters 
public class CollapseButton { 

@Parameter(required=true, allowNull=false, defaultPrefix=BindingConstants.ASSET) 
private String dataTarget; 

@Inject 
private ComponentResources resources; 

boolean beginRender(MarkupWriter writer) 
{ 
    writer.element("button", "data-target", dataTarget, "class", "btn btn-toggle pull-right", "type", "button", "data-toggle", "collapse"); 
    resources.renderInformalParameters(writer); 
    writer.element("span", "class", "caret"); 
    writer.end(); 
    writer.end(); 
    return false; 
} 

}

改進&優化仍然歡迎。

在我的情況

來源

2013-10-04 21:30:15 Ila

我解決了這個：

button data-toggle="collapse" type="button" class="btn btn-toggle pull-right" 
data-target="#${check_cases_collapse_uuid}

其中在Java中，我把這個：

@Property 
private String collapsibleComponentUUID; 

check_cases_collapse_uuid = UUID.randomUUID().toString();

來源

2014-06-30 07:20:39 Chaplin

創建一個可重用的Bootstrap「摺疊按鈕」作爲Java Tapestry組件

回答

相關問題