InputText doesn't update when other required fields are empty? - ajax

I have a dialog that pops up to the user to add some object by filling some fields, one of those fields require the selection of some row in some dataTable, when I select this row from the dataTable I have to update the inputText corresponding for that pick to show the user the name of the row he selected (aka: update the text inputText on rowSelect event), however the inputText doesn't get updated whenever there's another empty required field in the form. What could possibly be the problem?
Here are some code snippets:
<!-- This is the input field I wish to update on row select on pop up table -->
<p:inputText required="true" value="#{applicationsController.orgName}" id="orgNameApp" style="margin-right:5px;"></p:inputText>
<!-- This will pop up the data table which I will choose a row from -->
<p:commandButton icon="fa fa-hand-o-up" onclick="PF('organizationApplication').show()">
</p:commandButton>
this is the data table row select event:
<p:ajax event="rowSelect" listener="#{applicationsController.setOrganizationEdit}" update=":orgNameApp" />
The gets updated normally when I select a row if there are no empty required fields in the form, I've searched and searched, didn't find anything similar.
Any help would be extremely appreciated,
Thanks.

The command button processes the whole form, and since there are empty required fields, it will process them as it shows the data table pop up, and so the form will not be updated. trying process="#none" at first solved half the problem, but then after submitting the form the fields which were filled will not get updated anymore, so I changed the process from #none to the input field itself and it seemed to work just fine now, thanks to #Jaqen H'ghar for helping me in this.

Related

ClientSide RowSelect stops working after pagesize change in radgrid

I have many telerik rad grids in my project .
It initialize with ability to have client side row selection with
<clientsettings>
<Selecting AllowRowSelect="True" />
</clientsettings>
it is ok and in first load when my paging selector is on 10 object per grid selecting works fine , but when I change page size to 20 or 50 selecting suddenly stops working and I can not select row as before . Can anyone help me with this ?
RadGrid loses its current selection on postback - e.g. when the data is sorted, a new
group or filter is added, or when the current page changes.
You can try following approaches to implement a way to persist the client-side selection. (sample code snippet is in the attached link)
Using Web Storage
Using JavaScript array
The following logic is used to persist the selected rows:
Handle OnRowSelected and OnRowDeselected events for RadGrid. In the handlers you should update the collection of the selected items.
Handle OnRowCreated event. In this handler you should check if the current item is present in the selected rows collection and select
it if necessary.
For full details, please check this article - Persisting the Selected Rows Client-side on Sorting/Paging/Filtering/Grouping

Ajax update of datatable from a modal after filtering

My question is very similar to this:
Ajax update doesn't work, when using filter on datatable (JSF, Primefaces).
I have a dataTable with an "Open" button (a commandButton) for each entry/row in the table, on click of which, a dialog will open. I have a form in the dialog that I can update and save. Once I save my changes, I will get back on the dataTable closing the dialog I'm in, updating the results of the save that happened in the dialog on the entry in the table (whose "Open" was clicked to open the dialog).
If I save the results from the dialog and use the update attribute to update the results of the save on the table entry, it works fine. However, if the dataTable was filtered in the first place and then the dialog was opened, then the update does not result in update of the table entry until I actually refresh/reload the page.
The
oncomplete="PF(':parentForm:dataTableVar').filter()"
and
oncomplete="PF(':parentForm:dataTableVar').clearFilters()"
solutions recommended in the other question I referenced don't seem to have any effect in my case.
Any suggestions?
I use JSF v2.1.19 and PrimeFaces v5.1.
You need to mark the list in the attribute filteredValue on dataTable.
Ex: <p:dataTable filteredValue="#{bean.anotherListWithTheSameType}" />
In dialog, it's necessary filteredValue.
From here: http://www.primefaces.org/docs/vdl/4.0/primefaces-p/dataTable.html
It was my mistake to mention the id in place of the widgetVar. This:
oncomplete="PF('myTableWidget').filter()"
would work fine if the dataTable in question looks like:
<p:dataTable id="myTable" widgetVar="myTableWidget"...
I was wrongly trying it this way:
oncomplete="PF('myTable').filter()"

Rerender all h:inputText fields with same id inside h:dataTable

I think I am wasting my time yet again figuring out how to do such a simple thing in JSF, but assuming the following set-up:
<h:form id="form">
<h:dataTable id="table">
<! -- not shown: other columns with other input fields -->
<h:column>
<h:inputText id="myinput">
<f:ajax execute="#this" render="????" listener="#{bean.action}" />
</h:inputText>
</h:column>
</h:dataTable>
</h:form>
What do I specify in the render tag to ONLY re-render all "myinput" components across all rows in the datatable, ie without specifying "#form" that will re-render the other components as well? I have tried #this and ":form:table:myinput", but it always just re-renders the very first row of the dataTable. It seems like this should be such a simple use-case, so I have to obviously be misunderstanding something.
Note: I don't know if internally JSF creates N HtmlInputTextComponents for each row or just 1, but obviously when I say "all myinput components", I mean all rendered input fields back to the browser that were generated from the h:inputText tag and that have the same browser DOM id of form:table:myinput:n.
As a corollary and additional question, I don't want to process or re-render the whole form components because of possible validation/conversion errors. I simply want the following to happen: only the initiating "myinput" component that triggered the ajax call is validated, and if success, all of the other "myinput" components are populated and subsequently re-rendered with new model values that were changed from the action listener "#{bean.action}".
Additional information:
I am currently using the mojarra implementation version of JSF 2.1 (I think). I would like to avoid any third party JSF libraries.
Bonus questions (which perhaps the answer to my original question would also answer):
How to re-render and/or execute all input components but only for a single row
How to re-render and/or execute set of input components but only for a single row
How to re-render and/or execute all input components for a set of rows (not all)
How to re-render and/or execute set of input components for a set of rows (not all)
To everyone replying that I can set the id of the inputText based upon the current rowIndex or current iteration variable - NO, that does not work. See: Set id of a component within JSF dataTable to value from current item in the array
I really think the only way to accomplish what I want is to abandon using a datatable and render the table columns/rpws with JSTL myself such that I can assign unique ids and have full control. However, I still think this is a huge design flaw in JSF to not support such a seemingly simple use-case.
What do I specify in the render tag to ONLY re-render all "myinput" components across all rows in the datatable, ie without specifying "#form" that will re-render the other components as well?
TL;DR: How do I re-render the entire column?
This is not possible using standard JSF facilities. You basically need to (auto)generate the collection of client IDs form:table:0:myinput, form:table:1:myinput, form:table:2:myinput, etc yourself based on row count/index, and manually add them all to the PartialViewContext#getRenderIds() collection during #{bean.action}. It's not possible to specify them in render attribute as those client IDs don't exist in JSF component tree, but JSF strictly wants to validate them (and you thus end up with confusing "cannot find client ID" exceptions).
I'm aware that you want to avoid 3rd party libraries, but OmniFaces Ajax#updateColumn() provides exactly this functionality which only takes the table component and the (zero-based) column index as arguments. E.g.
public void action() {
// ...
UIData table = Components.findComponent("form:table");
Ajax.updateColumn(table, 2); // Updates third column.
}
Feel free to borrow/steal/improve the source under Apache 2.0 license if the remainder of OmniFaces isn't sufficiently convenient to not anymore consider it as an "average" 3rd party library.
We have by the way a possible enhancement in the queue for a future OmniFaces release, which must make this kind of requirements more hair-friendly: event driven updates.
How to re-render and/or execute all input components but only for a single row?
How to re-render and/or execute set of input components but only for a single row?
You can specify them in render attribute using relative client IDs like so:
<h:column><h:inputText id="input1" ... /></h:column>
<h:column><h:inputText id="input2" ... /></h:column>
<h:column><h:inputText id="input3" ... /></h:column>
<h:column><h:inputText id="input4" ...><f:ajax render="input1 input2 input3" ... /></h:inputText></h:column>
Note: there's no way to explicitly say "all input components". You'd have to specify them individually. If you happen to use PrimeFaces, or are open to using it, then PrimeFaces Selectors would make this much easier. See also among others How do PrimeFaces Selectors as in update="#(.myClass)" work?
How to re-render and/or execute all input components for a set of rows (not all)
How to re-render and/or execute set of input components for a set of rows (not all)
Also here, no standard facility. You could extend on the aforementioned Ajax#updateColumn() source code. The key problem is that you wanted to update other rows as well than only the current row. For that you'd really need to (auto)generate full client IDs and add them to PartialViewContext#getRenderIds().
<h:form id="form">
<h:dataTable id="table" rowIndexVar="idx">
<! -- not shown: other columns with other input fields -->
<h:column>
<h:inputText id="myinput#{idx.index}">
<f:ajax execute="#this" render="????" listener="#{bean.action}" />
</h:inputText>
</h:column>
</h:dataTable>
</h:form>
using firebug, you can see that all your inputs have an id now. Now, you can put in your render what you want according to this id.
you must use
RequestContext.getCurrentInstance().update(lstIndex);
in your java code where lstIndex is the list of ids that you want to update

ValidationGroup easy explanation

Can someone help me with this line of code and tell me what it is looking for? This chunk of code is associated with a text box control on my page.
ValidationGroup="<%# ((TSAPassenger)((RepeaterItem) Container.Parent.Parent).DataItem).PaxKey %>" runat="server" ErrorMessage="Invalid Contact Name.">
When a postback occurs (via a button press, autopostback dropdown list, etc), ASP.NET will validate all inputs for the validation group specified on the control that caused the postback.
That line of code is grabbing the 'PaxKey' property of the data item for the repeater item two levels up in the control tree that contains the text box and using it to specify the validation group the textbox belongs to. This is likely there to limit the validation to just the fields for the record you're updating (as opposed to everything on the page).

Bypass JSF validation for a UIInput component

Here is the issue, JSF validation keeps flipping a field back to the last known value.
We are editing a page where the backing bean already has values.
(frequency = "weekly")
And we are required to show the default value of "please select.." even though that value will not pass validation (yes, I just want to leave the user on the page with the error message).
Is there any way to allow the user to choose "Select.." and not reset it to the last good value?
The user wont be allowed to save obviously, but we want to leave their invalid value selected.
User adds new object, selecting proper value from drop down
User saves successfully.
User Clicks "edit" and displays object with known value ("weekly")
User changes "weekly" to "select"
User clicks save
Validation message is shown (good) but frequency goes back to last value "weekly" (bad, I need it to stay on "Please select.." and let the user fix the drop down manually.
immediate="true" does not work on inputComponents, only commandComponents.
I recognize this, I've reported this more than one year ago as JSF issue 1299. This is still not resolved since it has a low priority. This is not specific to all UIInput components, but to MenuRenderer which is responsible for rendering the HTML <select> elements. All other HTML input elements behave as you would expect, the submitted value will be redisplayed (well, which is actually nothing as well).
Since you're already on JSF 2.0, I suggest you to solve this with a little help of f:ajax so that the dropdown won't be re-rendered and thus keeps its selection.
<h:selectOneMenu id="frequency" value="#{bean.frequency}" required="true">
<f:selectItems value="#{bean.frequencies}" />
<f:ajax render="frequencyMessage" />
</h:selectOneMenu>
<h:message id="frequencyMessage" for="frequency" />
The additional benefit is that the enduser has instant feedback and this is better for user experience.

Resources