相关疑难解决方法(0)

仅显示带图像的命令按钮

我试图只在我的页面上显示一个带图像的按钮,但我看到的只是带有^的按钮.以下是我的按钮的代码:

<p:commandButton onclick="lineSearch.show();" image="backgroung-image:url(/images/title_logo.jpg)"/> 
<p:dialog header="Modal Dialog" widgetVar="lineSearch" modal="true" onCloseUpdate="lineIdField" showEffect="scale" hideEffect="explode">  
    <ui:include src="lineSearch.xhtml"/>
</p:dialog>
Run Code Online (Sandbox Code Playgroud)

图像确实存在于images文件夹中.该按钮在页面中呈现如下:

<button id="j_idt23:j_idt27" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" type="submit" onclick="lineSearch.show();;PrimeFaces.ab({formId:'j_idt23',source:'j_idt23:j_idt27',process:'@all'});return false;" name="j_idt23:j_idt27" role="button" aria-disabled="false">
    <span class="ui-button-icon-primary ui-icon backgroung-image:url(/images/title_logo.jpg)"></span>
    <span class="ui-button-text">ui-button</span>
</button>
<script type="text/javascript">
    widget_j_idt23_j_idt27 = new PrimeFaces.widget.CommandButton('j_idt23:j_idt27', {text:false,icons:{primary:'backgroung-image:url(/images/title_logo.jpg)'}});
</script>
Run Code Online (Sandbox Code Playgroud)

谢谢!!!

jsf primefaces jsf-2

16
推荐指数
1
解决办法
7万
查看次数

需要帮助在命令按钮中显示图标图像

只是一个基本需求,但无法让它工作.我想有一个primefaces按钮来显示我的图像,没有任何文字.

但我得到的是一个只包含一个^字符而不显示图像的按钮,其尺寸仅为16x16.


所以,这是primefaces按钮:

<p:commandButton image="ui-icon-csv" title="CSV Document" ajax="false">
    <p:dataExporter type="csv" target="gridRPBDetails" 
        fileName="#{tInputBean.exportFilename}" />
</p:commandButton>
Run Code Online (Sandbox Code Playgroud)

这是css文件:

.ui-icon-csv {
    background-image: url(images/csv_small.png);
}
Run Code Online (Sandbox Code Playgroud)

这是按钮生成的html:

<button type="submit" onclick=";" 
    name="gridRPBDetails:j_idt82" id="gridRPBDetails:j_idt82" 
    class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary" 
    role="button" aria-disabled="false">
        <span class="ui-button-icon-primary ui-icon ui-icon-csv"></span><span class="ui-button-text">CSV Document</span>
</button>
Run Code Online (Sandbox Code Playgroud)

为了证明图像可以访问,我尝试这个URL,实际上它显示了图片:

http://albert:8080/mywebapp/faces/javax.faces.resource/images/csv_small.png
Run Code Online (Sandbox Code Playgroud)

我使用tomcat 7,这些是我的依赖:

<dependency>
    <groupId>org.primefaces</groupId>
    <artifactId>primefaces</artifactId>
    <version>2.2.1</version>
</dependency>
<dependency>
    <groupId>com.sun.faces</groupId>
    <artifactId>jsf-api</artifactId>
    <version>2.0.4-b09</version>
    <scope>compile</scope>
</dependency>
<dependency>
    <groupId>com.sun.faces</groupId>
    <artifactId>jsf-impl</artifactId>
    <version>2.0.4-b09</version>
    <scope>compile</scope>
</dependency>
Run Code Online (Sandbox Code Playgroud)

出了什么问题?

谢谢 !

html css jsf primefaces jsf-2

8
推荐指数
1
解决办法
3万
查看次数

标签 统计

jsf ×2

jsf-2 ×2

primefaces ×2

css ×1

html ×1