jQuery cluetip: Manipulate content after rendering
I may be stating this incorrectly, but is there any way to manipulate (using JavaScript) the content in an cluetip once the content has been (dynamically) loaded to the external .jsp?
I have a list of items being displayed, and I want to bold some of them. I cannot add ID's or classes individually to any of these items in the list, prior to rendering. It's basically a data dump
FYI, we're using JSF to pull the items 开发者_JS百科on the .jsp, which are rendered in HTML as a table:
<h:panelGrid columns="1">
<h:column>
<h:selectManyCheckbox layout="pageDirection" value="#{advancedtoolscontroller.roleItems}">
<f:selectItems value="#{advancedtoolscontroller.roleList}" />
</h:selectManyCheckbox>
</h:column>
</h:panelGrid>
Any help is greatly appreciated...
You need to assign the h:selectManyCheckbox
and any parent UINamingContainer
components (e.g. h:form
, h:dataTable
, etc) an unique ID. This way JSF will generate the client ID's accordingly, otherwise it will autogenerate unpredictable client ID's which you cannot use in JS. To find out how they have been generated, just rightclick the page in webbrowser and choose View Source.
There's however one small caveat, JSF uses the colon :
as UINamingContainer
separator, e.g. formid:checkboxid
. The colon is an illegal character in CSS. To select them in CSS/jQuery anyway, you need to escape them with a backslash. E.g. formid\:checkboxid
.
Besides, the h:dataTable
will append one more identifier to the client ID after the datatable ID, namely the row index, e.g. formid:datatableid:0:checkboxid
. But that should look obvious enough when you see the patterns in the generated HTML output.
The h:selectManyCheckbox
on its turn assigns every checkbox an unique client ID and the same client name. Again, just check the generated HTML output to see the patterns.
In jQuery you could also use the jQuery.filter()
to filter out checkboxes of interest based on the last part of their client ID/name.
精彩评论