是否有可能更改JSF中的元素ID分隔符？ [英] Is it possible to change the element id separator in JSF?

问题描述

例如，以下片段：

 < h：form id =levelone> 
< h：inputText id =leveltwovalue =Test/> 
< / h：表格> 
  

生成以下标记：

 < form id =levelonename =levelonemethod =postaction =/ test / testPage.html
 enctype =application / x-www-form -urlencoded> 
< input id =levelone：leveltwotype =textname =levelone：leveltwo
 value =Test/> 
< / form> 
  

是否可以将自动生成的ID更改为使用与冒号不同的分隔符？ / strong>

例如，我想改变

  levelone：leveltwo 
  

至

  levelone-leveltwo 
  

背景

我们在web应用程序中使用 Mojo JavaScript应用程序框架，似乎并不类似于ID中的冒号。

解决方案

在JSF 1.x中这是不可能的，但是自JSF 2.x以来，在 web.xml中将它定义为 init-param javax.faces.SEPARATOR_CHAR code>。

这就是说，我想你只是想改变它，因为你想让你的CSS工作，是吗？冒号：是CSS标识符中的一个特殊字符，它表示一个伪选择器。如果这个原因对你来说是真实的，那么知道你可以通过 \ 这个通常的方式逃避CSS中的特殊字符可能是很好的。 b

因此，例如

 ＃levelone \：leveltwo {
 color：blue; 
 
 $ / code> 

应该适用于普通浏览器（对于IE6 / 7，您需要<$ c



当你打算将它与 jQuery 或任何其他JavaScript框架，它可以借助 CSS选择器：



  var leveltwo = $（'＃levelone \ \：leveltwo'）; 
  






或者，您也可以给它一个 styleClass ，然后你可以将它与CSS类关联起来。因此，例如



 < h：inputText styleClass =myinput/> 
  

它会产生



 < input type =textclass =myinput/> 
  

可以用



  .myinput {
颜色：蓝色; 
} 
  





另见

• 如何选择JSF组件使用jQuery？


• 如何使用JSF生成的HTML元素ID和冒号：在CSS选择器中？

For example, the following snippet:

<h:form id="levelone">
    <h:inputText id="leveltwo" value="Test" />
</h:form>

generates the following markup:

<form id="levelone" name="levelone" method="post" action="/test/testPage.html" 
      enctype="application/x-www-form-urlencoded">
   <input id="levelone:leveltwo" type="text" name="levelone:leveltwo" 
          value="Test" />
</form>

Is it possible to change the automatically generated ids to use a different separator than colon?

For example, I'd like to change

levelone:leveltwo

to

levelone-leveltwo

Background

We're using the Mojo JavaScript application framework in our webapp, and it doesn't seem to like the colons in the id's.

解决方案

This is not possible in JSF 1.x, but since JSF 2.x you can define it in web.xml as init-param of javax.faces.SEPARATOR_CHAR.

That said, I guess that you just wanted to change it because you'd like to get your CSS to work, is it? The colon : is namely a special character in CSS identifiers, it represents a pseudo selector. If this reason is true for you, then it might be good to know that you can escape special characters in CSS the usual way by \.

Thus, e.g.

#levelone\:leveltwo {
    color: blue;
}

ought to work for normal browsers (for IE6/7 you need #levelone\3A leveltwo instead).

The same applies when you intend to use it with jQuery or any other JavaScript framework which selects elements with help of CSS selectors:

var leveltwo = $('#levelone\\:leveltwo');

Alternatively, you can also just give it a styleClass which you in turn can correlate with a CSS class. Thus, e.g.

<h:inputText styleClass="myinput" />

which generates

<input type="text" class="myinput" />

can be styled with

.myinput {
    color: blue;
}

See also

• How to select JSF components using jQuery?
• How to use JSF generated HTML element ID with colon ":" in CSS selectors?

这篇关于是否有可能更改JSF中的元素ID分隔符？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！