Disable row selection for a few rows only in a p:dataTable
I would like to know if there is a way of disabling the radio-based row selection for a given set of rows in Primefaces, based on a bean property.
Example:
<p:dataTable var="foo" value="#{bean.foos}" selection="#{bean.selectedFoo}">`
<p:column selectionMode="single" />
<p:column>
<h:outputText value="#{foo.bar}" />
</p:column>
<p:dataTable>
In this case, imagine I would like to disable the rows where foo.bar == 1,5,10
, by disabling the rows I mean disable the radio button associated with the row.
I couldn't figure out a way of accomplish that... any ideas? Even a css + javascript hack s开发者_运维知识库olution would be acceptable.
Since 4.0 version, Primefaces datatable comes with a disabledSelection
property.
<p:dataTable var="foo" value="#{bean.foos}" selection="#{bean.selectedFoo}" disabledSelection="#{foo.bar == 1}">
<p:column selectionMode="single" />
<p:column>
<h:outputText value="#{foo.bar}" />
</p:column>
<p:dataTable>
Then, when foo.bar == 1
is true, checkbox will be disabled.
I encountered this same issue where I wanted to disable only certain rows from selection (single or multiple) based on a bean property. The short answer for me was to just hide the radio/checkbox on that row so it could not be selected. My needs required me to be able to process additional selections at run-time. This meant that I had to be sure the row(s) were un-selected physically before any further selections were made so they weren't re-processed in subsequent processing, so beware of that condition.
Here's what I did, for others that may stumble upon this question in the future.
1) In the p:datatable I added the rowStyleClass attribute, and based on the bean criteria, provided a class, such as: 'is-selectable' or 'not-selectable'.
rowStyleClass="#{myBean.alreadyProcessedList.contains(item) ? 'not-selectable' : 'is-selectable'}"
In my run-time process, selected rows were added to this list so they would be made 'not-selectable' once the form was rendered again after processing. Your initial load should have the non-selectable rows already added to the list, or handle through whatever condition you need in your case.
2) Define CSS to make the .not-selectable hide the radio/checkbox. Using '!important' was necessary to override the in-line styling.
tr.not-selectable div.ui-radiobutton,
tr.not-selectable div.ui-chkbox {
visibility: hidden !important;
}
You can try disabling with Jquery as follows
<script type="text/javascript" src="jquery.js"></script>
<script>
$(function(){
$("#myform input[type = radio]:nth(1)").attr('disabled', 'disabled');
});
</script>
myform:your Form Name Inplace of nth(1) you can mention the row number to be dispbled.
Set the Property disabledSelection (Disables row selection when true. Overrides p:column's disabledSelection attr. Example: var="xxx" disabledSelection="#{xxx.year > 1960}"
精彩评论