In my program, the frontend is created using Primefaces. When creating the registration form, I put a checkbox, which is the acceptance of the terms of service. I would like the checkbox to turn red when clicking "Register" if this checkbox is not checked.
<p:selectBooleanCheckbox immediate="true" id="checkbox"
value="#{backingBean.isChecked}"
style="#{backingBean.isChecked ? 'background-color:red':'background-color:white'}">
</p:selectBooleanCheckbox>
In my baking bean, I have a private field isChecked that stores a boolean.
My first problem is that when I put in 'style' properties " background-color, the color changes also the area around the checkbox, not the border itself. Border-color also does not work.
My second problem is that when I click "Register", the checkbox does not change color.
Related
I am trying to develop AutoComplete using Primeface p:autoComplete tag. Suggestion list value is selectable and set to textbox on enter key hit but the problem is if i hover on item and press mouse click then list item value is not set to textbox. Here is the snippet
<p:autoComplete
value="#{autoComplete.city}"
completeMethod="#{autoComplete.getCityList}"
tabindex="1" id="city" placeholder="Mumbai" appendTo="#this"
queryDelay="100">
</p:autoComplete>
Currently i'm stuck in create two dropdown list in jsf by click a "Add" button.
Initial i have a form with two dropdownlist, a "Add" button and a "submit" button.
The first dropdownlist is list country. The second dropdownlist is list city.
When user choose a country then the second dropdownlist will add dynamic city of this country(i done this using ajax f:ajax).
how can i add two other dropdownlist(list country and list city also) when add button clicked?(it mean user can add a lot of pair dropdownlist using add button)
how about structure of bean to manage all pair dropdownlist when i click submit button?
Please give me some example code to do it.
Thanks
Have you tried using c:forEach? Similar to the following:
<c:forEach var="i" begin="1" end="#{bean.numberOfAddsCLicked}" step="1">
<!-- Your elements to repeat here. Probably bind their values to bean.country[i] respective bean.city[i] with country and city being arrays of bean.numberOfAddsCLicked -->
</c:forEach>
I have a rich:extendedDataTable and a a4j:commandButton outside this table. When clicking the button, I want to rerender only one row and not the whole table so that the scroll remains on my selected row.
For that, I implemented the solution proposed on this other thread: reRender a specific row of rich:dataTable
It worked but it has a terrible side effect. I only rerender one cell and upon being rerendered, the cell shows a bit odd and it's not aligned anymore with the rest. Checking the source, I noticed that this rendered cell now has a <td class="rich-table-cell"...>and the other cells have <td class="extdt-cell rich-extdt-cell" ...>. So the rerender gives my cell a rich:dataTable class name instead of the rich:extendedDataTable class name that it belongs to.
Any ideas why and what should I do to have it rerender with the correct class?
Im having a problem with Primefaces tabview. It's tabs consists of selectOneMenu elements that look like this:
`
<p:selectOneMenu value="#{bean.currentItem.marketType}">
<f:selectItems value="#{bean.marketTypes}"/>
</p:selectOneMenu>
`
Now, I show this view as a dialog every time i select row from a dataTable (in order to edit selected record). The strange behavior is: the first time I refresh the page, i select the row, and the dialog pops out correctly. In all tabs of a tabview, all selectOneMenu elements shows correct data for selected record. However, when i close dialog and reopen it by selecing row again, only those selectOneMenu elements shows correct data, which where in a selected tab from a tabview before the dialog was closed.
Does any one know how to keep data in all tabs every time I open a dialog without refreshing the page?
Solved, there is a bug in Primefaces that is described here:
Primefaces tabView executes form validation on tab change
I have been trying to call a custom listener when the cancel button is clicked in the primefaces rowEditor component. But I am not able to find the correct attribute to do this.
The problem with the cancel button is that it works fine when the row is already present in the dataTable, if I try to add a new row dynamically to the dataTable and click on the cancel button [ if I think that it is not required ], the empty row is shown in the dataTable, when the empty row should be deleted.
Would you please help me out ?
Try like (JSF2 + Primefaces 2.2.1) ...
<p:column headerText="Test">
<p:rowEditor>
<p:ajaxStatus oncomplete="#{yourBean.yourHandleMethod()}"></p:ajaxStatus>
</p:rowEditor>
</p:column>
I am afraid this functionality isn't available out of box. The rowEditor component has built in integration to a dataTable and its own events and listeners for editing a single existing row. The cancel button of the rowEditor component has the sole functionality of toggling the output and input facets of the Primefaces column components.
If you are good at jQuery you may be able to hack the functionality in by finding the DOM element by the cancel button class, jQuery('.ui-icon-close') and assigning a custom javascript event listener but this could be problematic in a dataTable where there are multiple rows and it sounds as if you would like to delete a blank row if Cancel is selected.
A better approach is create an Add New button that displays a dialog with a form. Submitting through the form in the dialog can add the necessary row to your dataTable.