I am using Primefaces 5.1 with JSF and PrettyFaces.In commandlink to press open page in new window at the page open new window fine but the rewrite URL is not working.
Javascript
var newwin=null;
function NewWindow(mypage,myname)
{
params = 'width='+screen.width;
params += ', height='+screen.height;
params += ', top=0, left=0';
//params +=', scrollbars=yes,menubar=yes,toolbar=yes';
params +=', scrollbars=yes';
newwin=window.open(mypage,myname, params);
if (window.focus)
{
newwin.focus()
}
return false;
}
</script>
Xhmtl
<p:commandLink value="Link" ajax="false" onclick="return
NewWindow('#{request.contextPath}/pages/student/userMain.xhtml','user');"/>
prettyConfig.xml
<url-mapping id="user">
<pattern value="/user" />
<view-id value="/faces/pages/student/userMain.xhtml"/>
</url-mapping>
My doubt is in same window URL reWrite is works fine but in new window not working it show given full path then how reWrite URL in new window.In above code to need any other changes to reWrite how to show in new Window.
Related
I would like to be able to trigger validation on my form prior to being allowed to select the files for upload when clicking on the "Choose" button of the fileUpload control in Primefaces. Is this possible? At present the user can click on "Choose" and "Upload" without validation kicking in. This is preventing my document from saving but the attachments are being created.
I know I could hide the fileUpload control until the form is successfully validated and saved but I would prefer to invoke validation when you click the "Choose" button if possible.
I've tried remoteCommand calls in the onStart but can't seem to get anything to force validation to occur.
It is possible to trigger form validation when p:fileUpload Choose button is clicked by combining Java Script and p:remoteCommand.
BASIC CONCEPT
intercept Choose button click event, prevent default outcome (opening of file chooser dialog) and run p:remoteCommand instead,
when p:remoteCommand completes, and if validation is OK, do not prevent Choose button clicks any more until some data on form input elements is changed again.
PROOF OF CONCEPT EXAMPLE CODE
Add this Java script in your page
<script>
var triggerValidation;
window.onload = function () {
//initially (after page is loaded) trigger validation on Choose btn click
triggerValidation = true;
//define button click listener
registerChooseBtnClick();
};
function registerChooseBtnClick() {
//var chooseBtn = document.getElementsByClassName("ui-fileupload-choose")[0];
// or if you define p:upload widgetVar you can use PF function
var chooseBtn = PF('fileUploadWidget').chooseButton[0];
chooseBtn.addEventListener('click', fnRef, false);
}
var fnRef = function (event) {
console.log("Button clicked");
if (triggerValidation) {
//prevent file browser to open
event.preventDefault();
//trigger validation via p:remoteCommand;
submitSelection();
} else {
//File browser will be opened at this point
}
};
function checkIfValidationFailed(xhr, status, args) {
if (args) {
if (args.validationFailed) {
console.log("Validation failed");
triggerValidation = true;
} else {
triggerValidation = false;
}
}
}
//call each time when form input elements (inputText, ...) change value
function forceValidation(){
triggerValidation = true;
}
</script>
and add p:remoteCommand
<p:remoteCommand
name="submitSelection" process="#form"
oncomplete="checkIfValidationFailed(xhr, status, args)" resetValues="true"/>
Also here is xhtml page for quick testing
<h:form id="form">
<p:messages autoUpdate="true"/>
<p:panelGrid columns="1">
<!--size is integer variable-->
<p:inputText id="size" maxlength="3"
value="#{yourBean.size}"
required="true" requiredMessage="Size is missing"
onchange="forceValidation();"/>
<p:fileUpload
id="upload"
widgetVar="fileUploadWidget"
fileUploadListener="#{yourBean.onUpload}"
multiple="true"
allowTypes="/(\.|\/)(jpg|png)$/" />
</p:panelGrid>
<p:remoteCommand
name="submitSelection" process="#form"
oncomplete="checkIfValidationFailed(xhr, status, args)" resetValues="true"/>
<p:commandButton
id="submitBtn" value="Sumbit" process="#form"
actionListener="#{yourBean.onSubmit()}"/>
</h:form>
due to some other reasons moved some part of DOM into other place by using JQuery, in this moved DOM i have one non-ajax button its not working now.
below is the moving code
var duplicateOverCount = 1;
var duplicateOverPandata;
var duplicateOverRecdata;
function duplicateScrOvrPanFix() {
while (duplicateOverCount < 2) {
duplicateOverPandata = $('.duplicatSrcOverLaySty')[0];
duplicateOverRecdata = $('.duplicateSrcRecordsSty')[0];
$('.duplicatSrcOverLaySty').remove();
$('.duplicateSrcRecordsSty').remove();
duplicateOverCount++;
}
$(duplicateOverPandata).appendTo('.frozencolDatatabe');
$(duplicateOverRecdata).prependTo('.frozencolDatatabe');
}
Below is non-ajax call button, it need download file. i'm using primefaces 6
<p:commandButton
value="exportExcel"
ajax="false" action="#{xyzMBean.abc}" onclick="bypassLocking();">
<p:fileDownload
value="#{reportMBean.streamedContent}" />
</p:commandButton>
I am using PrimeFaces 5.1 with PrettyFaces for rewrite URL in my project. I face one problem in PrettyFaces. E.g in same (same window PrettyFaces) view open the page fine. But using menuitem click open page new window time page not show shown so PrettyFaces not working.
I try below code:
prettyface.xml
<url-mapping id="studenFaceId">
<pattern value="/BSCMain" />
<view-id value="/pages/bsc/bscMain.xhtml"/>
</url-mapping>
javascript
function NewWindow(mypage,myname)
{
params = 'width='+screen.width;
params += ', height='+screen.height;
params += ', top=0, left=0';
params +=', scrollbars=yes';
newwin=window.open(mypage,myname, params);
if (window.focus)
{
newwin.focus()
}
return false;
}
xhtml
<p:menuitem id="dashBoard" ajax="false" value="student"
onclick="return NewWindow('./../bsc/bscMain.xhtml','BSCMain');"
update="main"/>
My doubt I use same window prettyface work fine but in same to open new window time prettyface not working it will shown only a empty page.
You should use the pretty URL instead of some relative view id in your JavaScript. Something like:
<p:menuitem id="dashBoard" ajax="false" value="student"
onclick="return NewWindow('#{request.contextPath}/BSCMain','BSCMain');"
update="main"/>
I have a PrimeFaces page with following code:
<pm:content id="content">
<p:dataList value="#{likeditems.likedItems}" var="item" pt:data-inset="true" paginator="true" rows="5">
<f:facet name="header">
Products you liked in the past
</f:facet>
<h:outputLink value="#{item.url}" target="_new">
<p:graphicImage name="http://example.com/my-product-mobile/f/op/img/underConstructionImage.jpg" />
<h2>#{item.title}</h2>
<p>Approx. #{item.price} (for most up-to-date price, click on this row and view the vendor's page)</p>
</h:outputLink>
<f:facet name="footer">
Products you liked in the past
</f:facet>
</p:dataList>
</pm:content>
When the user clicks on the h:outputLink, I want 2 things to happen:
A new page with URL item.url is opened in the browser.
Method likeditems.itemLinkClicked(item) is invoked (in that method I update the number of times a particular link was clicked).
First thing is already working (target="_new").
How can I implement the second one (method call for updating the number of times the link was clicked) without the first ceasing to work?
First thing is already working (target="_new").
The target should actually be _blank.
How can I implement the second one (method call for updating the number of times the link was clicked) without the first ceasing to work?
The simplest (naive) JSF-ish way would be triggering a <p:remoteCommand> on click.
<h:outputLink value="#{item.url}" target="_blank" onclick="count_#{item.id}()">
...
</h:outputLink>
<p:remoteCommand name="count_#{item.id}" action="#{likeditems.itemLinkClicked(item)}" />
But this generates lot of duplicate JS code which is not very effective. You could put it outside the data list and fiddle with function arguments. But this still won't work when the enduser rightclicks and chooses a context menu item (open in new tab, new window, new incognito window, save as, copy address, etc). This also won't work when the enduser middleclicks (default browser behavior of middleclick is "open in a new window").
At ZEEF we're using a script which changes the <a href> on click, middleclick or rightclick to an URL which invokes a servlet which updates the count and then does a window.open() on the given URL.
Given a
<h:outputLink value="#{item.url}" styleClass="tracked" target="_blank">
the relevant script should basically look like this:
// Normal click.
$(document).on("click", "a.tracked", function(event) {
var $link = $(this);
updateTrackedLink($link);
var trackingURL = $link.attr("href");
$link.attr("href", $link.data("href"));
$link.removeData("href");
window.open(trackingURL);
event.preventDefault();
});
// Middle click.
$(document).on("mouseup", "a.tracked", function(event) {
if (event.which == 2) {
updateTrackedLink($(this));
}
});
// Right click.
$(document).on("contextmenu", "a.tracked", function(event) {
updateTrackedLink($(this));
});
// Update link href to one of click count servlet, if necessary.
function updateTrackedLink($link) {
if ($link.data("href") == null) {
var url = $link.attr("href");
$link.data("href", url);
$link.attr("href", "/click?url=" + encodeURIComponent(url));
}
}
and the click servlet should look like this (request parameter validation omitted for brevity):
#WebServlet("/click")
public class ClickServlet extends HttpServlet {
#EJB
private ClickService clickService;
#Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String url = request.getParameter("url");
clickService.incrementClickCount(url);
response.sendRedirect(url);
}
}
Note that this way the target="_blank" isn't necessary. It would only be used by users who have JavaScript disabled. But then many more other things on the website wouldn't work anyway, including the above JS tracking. It this is also really your concern, then you'd better just put that click servlet URL directly in <h:outputLink value>.
Using Primefaces 4.0 and JSF 2.2.
I would like to send the visitor to a page in a new window (not tab). The landing page is a jsf page called grade.xhtml
I tried:
<h:commandLink value="OK" onclick="window.open('grade.html', 'newwindow','width=300, height=300'); return false;"/>
This gets to a 404. Obviously this is all happening client side so grade.html doesn't get generated from grade.xhtml. How should I do?
Note: if I put onclick="window.open('grade.xhtml', 'newwindow','width=300, height=300'); return false;" then the page does open, but it is the jsf (xhtml code) not html version that shows up.
try this:
<h:commandLink value="OK" action="grade.xhtml" target="_blank"/>
Look an example here: When i click on any link it should Open in the same New Window in JSF, Primefaces
I use javaScript for this.. Try it:
<script type="text/javascript" language="javascript">
function funcForWindowPopup()
{
var popup = null;
popup = window.open("grade.xhtml", "popup", "toolbar=no,menubar=no,scrollbars=yes,location=no,left=350,top=50,width=650, height=600");
popup.openerFormId = "formID";
popup.focus();
}
</script>
You can change parameters as you need;)
Open the URL in new window from JSF controller.
HttpServletResponse res = (HttpServletResponse) FacesContext.getCurrentInstance().getExternalContext().getResponse();
HttpServletRequest req = (HttpServletRequest) FacesContext.getCurrentInstance().getExternalContext().getRequest();
String uri = req.getRequestURI();
res.getWriter().println("<script>window.open('" + myUrl + "','_blank', 'location=yes,height=600,width=800,scrollbars=yes,status=yes'); window.parent.location.href= '"+uri+"';</script>");
FacesContext.getCurrentInstance().responseComplete();