如何使JSF图像按钮 [英] How to make an image button in JSF

查看：106 发布时间：2016/8/16 22:05:21 jsf button primefaces

本文介绍了如何使JSF图像按钮的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想有一个看起来像一个按钮组件，但不是文本应该包含一个图像。
由于标准的按钮不提供这个功能，我试图用一个＆LT; H：commandLink＆GT; ：

 ＆LT; H：commandLink行动=＃{} some_action＆GT;
    ＆LT;电话号码：面板的styleClass =some_style＆GT;
        ＆LT; H：graphicImage的值=＃{} some_image＆GT;
    ＆LT; / P：面板＆gt;
＆LT; / H：commandLink＆GT;

这是行不通的。在＆LT; H：commandLink＆GT; 被翻译成＆LT; A＆GT; 标记和＆LT;电话号码：面板＆gt; 到＆LT; DIV＆GT; 。 ＆LT; A＆GT; 标签都有效可能不包含＆LT; DIV＆GT; 标签都有效，因此 ＆LT; DIV＆GT; -tag自动放置在＆LT外; A＆GT; -tag。
其结果是，只有图像是可以点击的，不属于其风格看起来像一个按钮周围的面板。有没有一种方法，使链接周围面板部分，或者把图像的按钮里面呢？

我的项目使用JSF和Primefaces库：

 ＆LT; HTML的xmlns =http://www.w3.org/1999/xhtml
的xmlns：H =http://java.sun.com/jsf/html
的xmlns：复合=http://java.sun.com/jsf/composite
的xmlns：F =http://java.sun.com/jsf/core
的xmlns：UI =http://java.sun.com/jsf/facelets
的xmlns：P =http://primefaces.prime.com.tr/ui＆GT;

解决方案

有几个方法，你可以将图像添加到<一个href=\"http://download.oracle.com/javaee/5/javaserverfaces/1.2/docs/tlddocs/h/commandButton.html\">commandButton:

使用图像属性

 ＆LT; H：的commandButton行动=＃{} some_action形象=button.gif/＆GT;

  的图像的绝对或相对URL
  要显示该按钮。如果
  规定，这种输入元素将
  是类型形象。否则，它会
  是由类型中指定的类型的
  属性与由指定的标签
  值属性。

使用CSS
＆LT; H：的commandButton行动=＃{} some_action的styleClass =键/＆GT;.button {     背景：白色的URL（'button.gif'）不重复上面; }
I want to have a component that looks like a button, but instead of text it should contain an image. Because the standard button does not offer this functionality, I tried to use a <h:commandLink>:
<h:commandLink action="#{some_action}"> <p:panel styleClass="some_style"> <h:graphicImage value="#{some_image}"> </p:panel> </h:commandLink>
This doesn't work. The <h:commandLink> is translated into an <a> tag, and the <p:panel> into a <div>. <a>-tags may not contain <div>-tags, so the <div>-tag is automatically placed outside the <a>-tag. The result is that only the image is clickable, not the surrounding panel which is styled to look like a button. Is there a way to make the surrounding panel part of the link, or to put an image inside a button?

My project uses JSF and the Primefaces library:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:composite="http://java.sun.com/jsf/composite" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.prime.com.tr/ui">

解决方案
There are a couple ways you can add an image to a commandButton:

Using the image attribute
<h:commandButton action="#{some_action}" image="button.gif" />

Absolute or relative URL of the image to be displayed for this button. If specified, this "input" element will be of type "image". Otherwise, it will be of the type specified by the "type" property with a label specified by the "value" property.

Use CSS
<h:commandButton action="#{some_action}" styleClass="button" /> .button { background: white url('button.gif') no-repeat top; }

这篇关于如何使JSF图像按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

如何使JSF图像按钮 [英] How to make an image button in JSF

问题描述

相关文章

其他开发最新文章

热门教程

热门工具

登录关闭

如何使JSF图像按钮 [英] How to make an image button in JSF

问题描述

相关文章

其他开发最新文章

热门教程

热门工具

登录 关闭

登录关闭