Is it possible to keep a rich:popupPanel open after a form has been submitted and another page loaded?
As an example, go to richfaces showcase and click "Call the popup" then browse somewhere else (using a tab like "Modal panel example" or the menu). The popup will disappear as soon as the form gets submitted. I would like to let it "survive" the page change (and possibly remain in the same position).
Thank you for any suggestions!
Yes, it is. You just need to set the attribute show to something that evaluates to true in the next request:
<rich:popupPanel id="popup" show="#{someBean.showPopup}" ...>
Then you just need to make sure the property the method getShowPopup returns true when the popup needs to be shown.
From the docs:
show | boolean | If "true" value for this attribute makes a modal
panel opened as default. Default value is "false"
See also this section on rich:popupPanel.
Related
In one of our page we have a search button that open a search dialog so that the users can search and import some data from a remote system.
Now got I new requirement that this same dialog must be showed every time the page is opened - but only when the page will be used to create a new registry, in the update mode it should be showed only if the user click the button.
I've already tried some things, I can call the dialog by MB using Primefaces engine as below:
RequestContext.getCurrentInstance().execute("dialogArmaBos.show()")
This command Works great for the button case, but I can get it working when the page opens. If I try to use in the PostConstruct nothing happens.
I tried also <f:event type="preRenderView" ... with <f:metadata ... but nothing changes too.
Is there some way to make it?
According to the fabulous PrimeFaces documentation There is a visible attribute. Quote from the docs:
visible false Boolean When enabled, dialog is visible by default.
So simply use an EL in that attribute to have it show on pageload
<p:dialog visible="#{myBean.createMode}"... >
and have a boolean field in that bean that returns true if in creation mode.
For the rest you can show/hide it with the client-side api if needed
I have a popup dialog developed in IceFaces 1.8.x (JSF 1.2).
The dialog is reusable (used for account creation as well as modification) and has a cancel button with immediate = true (to avoid validations). This dialog suffered a problem in the past ,where old values were rendered on re-opening the dialog, but that problem is now fixed as directed here (by setting submittedValue to null etc.).
The problem that I am facing now is specific to a conditionally disabled input field (<ice:inputText>) and here is what happens:
The popup is first opened (say for account creation) and this field
is NOT disabled.
User then cancels this dialog and, as we have incorporated the fix mentioned above (setSubmittedValue(null)), the submittedValue for this field is set to null (along with other fields).
Now the user opens "modify account" dialog, where in this field IS disabled. Everything seems to be rendered fine until user makes any changes to the form.
When user changes some field (say name) in the form, a partial submit happens for the name field as expected, but along with it null value is submitted for this disabled field.
This problem can be worked around by adding a null check in the setter method for the field in question, but this is not the desired solution for the project - as there are multiple places where this could be needed and doesn't seem like a very intuitive thing to do.
So I need to understand:
Why is the setter for this disabled field getting called in the
first place? and that too with a null value. The setter is not
called for any other enabled fields.
More importantly, is there any way to fix this (other than adding null check in the setter)?
You must be using rendered attribute to show/hide the dialog
<ice:panelPopup modal="true" rendered="#{bean.enabled}">
When dialog is reopened, it is coming up with some residual values from previous instance
The solution (or workaround) is to use <c:if> instead of rendered attribute, this way the DOM is completely destroyed when dialog closes and created from scratch when dialog opens
<c:if test="#{bean.enabled}">
<ice:panelPopup modal="true">
...
</ice:panelPopup>
</c:if>
This way you even would not need the fix to set submittedValue to null
I am working on a JSP project, and I need a functionality that
whenever the check-box is checked, users are REQUIRED to choose an option (from a dropdown menu)
However, whenever the check-box is unchecked, picking an option will not be required.
Right now, my check-box looks like this:
<h:selectBooleanCheckbox class="someClass" value="#{someBean.check}" />
the check is a boolean value in my JAVA class, and my html page should be able to recognize the state of checkbox.
I am wondering how to apply the current state to my dropdown menu, so my dropdown menu will know if user needs to pick one option or not..
Will the use of Ajax listner work in this case?
How to get state of SelectBooleanCheckbox in Ajax Listener?
Or there's any other suggestions?
Thanks a lot!
my previous related question
Conditionally make inputs required depending on checkbox value
I am working on a large, worldwide application, which includes access from areas of low bandwidth. As such, I want to use a minimum of SSJS or partial refreshes for all the complex hide/when calculations. Here is what I have so far for a simple "hide/when":
A Yes/No radio button, with CSJS to show a panel ("Yes") or hide the
panel ("No").
The panel has a formTable inside it, and the values are shown or hidden, as per #1.
In the XPage's onClientLoad, the following code is run:
// "getRadioValue" is a simple script to return the value of a radio button
var v_value = getRadioValue("#{id:radioButton}");
v_div = '#{javascript:getClientId("radioButtonPanel")}';
// show or hide div simply use dojo to change the display of the panel
if (v_value == 'Yes') {
showDiv(v_div);
} else {
hideDiv(v_div);
};
For a new document, the onClientLoad script will hide the "radioButtonPanel" successfully. Changing the radio button to "Yes" will show the radioButtonPanel, just as clicking "No" will hide it. It works great! :-)
Once the document is saved and reopened in read mode, though, the onClientLoad CSJS event should read the saved value in the document, and decide to show the panel or not. When the document is opened in edit mode, the onClientLoad fires, reads the radioButton value and successfully shows or hides the panel.
This is what I've tried so far, to get it to work in read mode:
In CSJS, using "#{javascript:currentDocument.getItemValueString('radioButton'}" to get the value,
Doing some calculations in the "rendered" or "visible" properties, but that's SSJS and, if hidden, prevents any of the "show/hideDiv" CSJS visibility style changes.
Adding an old fashioned "div" to compute the style (which is what I used to do before XPages), but since I can't do pass-thru html any more, I can't seem to get a CSJS calculation for the style. Ideally, I can do something like this:
<div id="radioButtonPanel" style="<ComputedValue>">
Where the ComputedValue would read the back end value of the document, and decide to add nothing or "display:none".
Note that I don't want to use viewScopes, since this long form would need many of them for all the other hide/when's.
Is there any way to make this 100% CSJS? I feel like I'm very close, but I wonder if there's something I'm just missing in this whole process.
First, rather than computing style, I'd recommend computing the CSS class instead -- just define a class called hidden that applies the display:none; rule. Then toggling visibility becomes as simple as a call to dojo.addClass or dojo.removeClass.
Second, I see that you're using the #{id:component} syntax to get the client ID of the radio button but using SSJS to get the client ID of the panel. Use the id: syntax for both; this is still just a server-side optimization, but if there are many instances of these calculations, it adds up. Similarly, replace #{javascript:currentDocument.getItemValueString('radioButton'} with #{currentDocument.radioButton}. Both will return the same value, but the latter will be faster.
Finally, any attribute of a pass-thru tag (any component with no namespace, like xp: or xc:) can still be computed, but you'll need to populate the expression by hand, since the editor doesn't know which attributes for valid for these tags, and therefore doesn't provide a graphical expression editor. So if the ideal way to evaluate the initial display is by wrapping the content in a div, the result might look something like this:
<div class="#{javascript:return (currentDocument.getValue('radioButton') == 'Yes' ? 'visible' : 'hidden');}">
<xp:panel>
...
</xp:panel>
</div>
I am developing web application using A4J, Richfaces.
One of my requirement is, I need to check if the user has changed any values in the form when he is trying navigate away from the page.
I have save and cancel buttons in the page.
I am using a4j:command button for cancel functionality. Clicking on cancel button should do below things
Check if the user has modified anything in the form (this I am doing by using javascript and have a flag if user changed any values)
Display confirmation box (javascript confirm with values "Do you really want to discard the changes -- YES NO") when user changes form values
If user says YES, then submit the form using AJAX (by using A4J)
My a4j command button code is like this
<a4j:commandButton action="MyClass.cancel_action"
onclick="checkIsPageChanged()"/>
The issue here is, while using using a4j:commandButton, I cannot call the intermediate javascript function (the function which checks if user has updated any values and displays confirmation box) and then submit the request using ajax.
I have looked at the code generated by JSF and the code is like (not the exact but syntact)
<input type="button"
onclick="checkIsPageChanged();AJAX.submit('')/>
The thing is when I click on button, it is calling only checkIsPageChanged() and not calling AJAX.submit().
Any workaround for this will help me.
Thank you in advance.
Use a4j:jsFunction and call that from your a4j:commandButton when the checkIsPageChanged() returns true.
eg.
<a4j:commandButton action="MyClass.cancel_action"
onclick="if(checkIsPageChanged()) { cancel(); }"/>
<a4j:jsFunction name="cancel" action="MyClass.cancel_action"/>
To be more specific we can use:
onclick="if(!isPageChanged()) {return false}"
Returning false will not submit the request.