<script type="text/javascript">
function goBack(){
setTimeout(function previous()
{ location.href="/dataprod/application/myprofile/profile_contactus.faces";
}, 3000);
}
</script>
<html>
<h:commandButton value="Send Mail to dataprod.com"
action="#{ContactUs.sendMail}" styleClass="button" onClick="goBack()"/>
<h:commandButton value="Send Mail to dataprod.com"
action="#{ContactUs.sendMail}" styleClass="button"
onclick="setTimeout('history.go(-1)', 3000);"/>
Put a meta refresh header in the HTML head of the result page.
<meta http-equiv="refresh" content="3;url=profile_contactus.faces" />
It will go to profile_contactus.faces after 3 seconds.
Related
I created a CRUD operation with JSF and PrimeFaces 6 and EJB 3.1. The findAll() method works very fine because I can see the the fetched data List on the PrimeFaces DataTable. But when i click on Add, the popup shows up, but submiting the data to the managedbean does not work, i can see that, the command button does not seem to communicate with the bean. But the same code is working in another module of the same project. I keep wondering why this problem is occurring. I have tried all solutions such as Ajax="false", I have tried process="#this", I have also tried immediate="true", but nothing seems working. I have been stranded and need a solution. Thanks
THIS IS THE XHTML FILE
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:body>
<div>
<h:form id="subjectTopForm">
<p:growl id="growl" life="2000" />
<p:commandLink id="ajax" update="growl" onclick="PF('subjectAddDialog').show();">
<span class="btn waves-effect waves-light indigo">
<h:outputText value="Add new Subject"/>
</span>
</p:commandLink>
<!-- <BEGINNING OF SAVE POPUP DIALOG>-->
<p:dialog header="Add New Subject" widgetVar="subjectAddDialog" modal="true" height="auto" width="420" styleClass="customDialog">
<f:view>
<p:panelGrid columns="2">
<p:outputLabel value="SubjectName:" for="subjectName" class="table-row-height" />
<p:inputText id="subjectName" value="#{subject.sub.subjectName}" title="SubjectName" required="true" requiredMessage="The SubjectName field is required." />
<p:outputLabel/>
<p:commandButton process="#this" immediate="true" action="#{subject.addSubject()}" value="Add Subject" update=":subjectForm">
<f:ajax execute="subjectForm" render="subjectForm:subjectDataTable" />
<p:resetInput target=":subjectForm"/>
</p:commandButton>
</p:panelGrid>
</f:view>
</p:dialog>
<!-- END OF SAVE POPUP DIALOG-->
</h:form>
</div>
<div>
<h:form id="editSubjectPopupDialog">
<!-- UPDATE FORM DIALOG-->
<p:dialog header="Edit Subject" widgetVar="subjectEditDiaglog" modal="true" height="auto" width="420" styleClass="customDialog">
<f:view>
<p:panelGrid columns="2">
<p:outputLabel value="SubjectName:" for="subjectName" class="table-row-height" />
<p:inputText id="subjectName" value="#{subject.sub.subjectName}" title="SubjectName" required="true" requiredMessage="The SubjectName field is required." />
<p:outputLabel/>
<p:commandButton action="#{subject.editSubject()}" value="Save Changes" update=":editSubjectPopupDialog">
<f:ajax execute="subjectForm" render="subjectForm:subjectDataTable" />
<p:resetInput target=":editSubjectPopupDialog"/>
</p:commandButton>
</p:panelGrid>
</f:view>
</p:dialog>
<!--END OF UPDATE FORM DIALOG-->
</h:form>
</div>
<div>
<f:view>
<h:form id="subjectForm">
<h:dataTable value="#{subject.findAll()}" var="item" id="subjectDataTable">
<h:column>
<f:facet name="header">
<h:outputText value="SubjectName"/>
</f:facet>
<h:outputText value="#{item.subjectName}"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Edit"/>
</f:facet>
<p:commandLink action="#{subject.setSub(item)}" oncomplete="PF('subjectEditDiaglog').show()" update=":editSubjectPopupDialog">
<i class="mdi-editor-mode-edit">
</i>
</p:commandLink>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Delete"/>
</f:facet>
<h:commandLink action="#{subject.delete(item)}" onclick="return confirm('Are you sure?')">
<i class="mdi-action-delete">
</i>
<f:ajax render="subjectForm:subjectDataTable" />
</h:commandLink>
</h:column>
</h:dataTable>
</h:form>
</f:view>
</div>
<div>
<p>
</p>
<p>
</p>
</div>
</h:body>
</html>
BELOW IS THE JSF MANAGED BEAN
package com.nan.app.controller;
import com.nan.app.crud.entityclasses.Subjects;
import com.nan.app.crud.sessionbeans.SubjectService;
import javax.enterprise.context.SessionScoped;
import java.io.Serializable;
import java.util.List;
import javax.ejb.EJB;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.context.FacesContext;
/**
*
* #author Nandom
*/
#ManagedBean(name = "subject")
#SessionScoped
public class SubjectController implements Serializable {
#EJB
SubjectService service;
private Subjects sub = new Subjects();
public Subjects getSub() {
return sub;
}
public void setSub(Subjects sub) {
this.sub = sub;
}
public void addSubject() {
service.create(sub);
service.findAll();
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, sub.getSubjectName(), null);
FacesContext.getCurrentInstance().addMessage(null, message);
sub = new Subjects();
}
public void editSubject() {
service.edit(sub);
service.findAll();
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Update Executed Successfully", null);
FacesContext.getCurrentInstance().addMessage(null, message);
sub = new Subjects();
}
public void delete(Subjects entity) {
service.remove(entity);
service.findAll();
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Deleted Successfully", null);
FacesContext.getCurrentInstance().addMessage(null, message);
}
public Subjects find(Object id) {
return service.find(id);
}
public List<Subjects> findAll() {
return service.findAll();
}
}
Pls NOTE: I have a side navigation in my mail-layout.xhtml which the links are controlled by the navigation bean as shown below.
Main Application UI with Side Navigation
THE CODE FOR THIS LAYOUT IS BELOW
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- <h:outputStylesheet name="./css/default.css"/>
<h:outputStylesheet name="./css/cssLayout.css"/>-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="msapplication-tap-highlight" content="no"/>
<meta name="description" content="Materialize is a Material Design Admin Template,It's modern, responsive and based on Material Design by Google. "/>
<meta name="keywords" content="materialize, admin template, dashboard template, flat admin template, responsive admin template,"/>
<title>School Management System</title>
<!-- Favicons-->
<link rel="icon" href="#{resource['images/favicon/favicon-32x32.png']}" sizes="32x32"/>
<!-- Favicons-->
<link rel="apple-touch-icon-precomposed" href="#{resource['images/favicon/apple-touch-icon-152x152.png']}"/>
<!-- For iPhone -->
<meta name="msapplication-TileColor" content="#00bcd4"/>
<meta name="msapplication-TileImage" content="#{resource['images/favicon/mstile-144x144.png']}"/>
<!-- For Windows Phone -->
<link href="#{resource['css/widget.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<!-- CORE CSS-->
<link href="#{resource['css/materialize.min.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="#{resource['css/style.min.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<!-- Custome CSS-->
<link href="#{resource['css/custom/custom.min.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<!-- INCLUDED PLUGIN CSS ON THIS PAGE -->
<link href="#{resource['js/plugins/prism/prism.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="#{resource['js/plugins/perfect-scrollbar/perfect-scrollbar.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="#{resource['js/plugins/chartist-js/chartist.min.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="#{resource['js/plugins/data-tables/css/jquery.dataTables.min.css']}" type="text/css" rel="stylesheet" media="screen,projection"/>
<style>
.mdi-action-delete {
font-size: 25px;
}
.mdi-editor-mode-edit {
font-size: 25px;
}
.addForm {
display:inline-block;
width: 300px;
text-wrap:none;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.table-row-height {
height:30px;
}
</style>
</h:head>
<h:body>
<!-- Start Page Loading -->
<div id="loader-wrapper">
<div id="loader"></div>
<div class="loader-section section-left"></div>
<div class="loader-section section-right"></div>
</div>
<!-- End Page Loading -->
<!-- //////////////////////////////////////////////////////////////////////////// -->
<!-- START HEADER -->
<header id="header" class="page-topbar">
<!-- start header nav-->
<div class="navbar-fixed">
<nav class="navbar-color">
<div class="nav-wrapper">
<ul class="left">
<li><h1 class="logo-wrapper"><img src="#{resource['images/materialize-logo.png']}" alt="materialize logo"/> <span class="logo-text">Materialize</span></h1></li>
</ul>
<div class="header-search-wrapper hide-on-med-and-down">
<i class="mdi-action-search"></i>
<input type="text" name="Search" class="header-search-input z-depth-2" placeholder="Explore Materialize"/>
</div>
<ul class="right hide-on-med-and-down">
<li><img src="#{resource['images/flag-icons/United-States.png']}" alt="USA" />
</li>
<li><i class="mdi-action-settings-overscan"></i>
</li>
<li><a href="javascript:void(0);" class="waves-effect waves-block waves-light notification-button" data-activates="notifications-dropdown"><i class="mdi-social-notifications"><small class="notification-badge">5</small></i>
</a>
</li>
<li><i class="mdi-communication-chat"></i>
</li>
</ul>
<!-- translation-button -->
<ul id="translation-dropdown" class="dropdown-content">
<li>
<img src=" #{resource['images/flag-icons/United-States.png']}" alt="English" /> <span class="language-select">English</span>
</li>
</ul>
<!-- notifications-dropdown -->
<ul id="notifications-dropdown" class="dropdown-content">
<li>
<h5>NOTIFICATIONS <span class="new badge">5</span></h5>
</li>
<li class="divider"></li>
<li>
<i class="mdi-action-add-shopping-cart"></i> A new order has been placed!
<time class="media-meta" datetime="2015-06-12T20:50:48+08:00">2 hours ago</time>
</li>
</ul>
</div>
</nav>
</div>
<!-- end header nav-->
</header>
<!-- END HEADER -->
<!-- //////////////////////////////////////////////////////////////////////////// -->
<!-- START MAIN -->
<div id="main">
<!-- START WRAPPER -->
<div class="wrapper">
<!-- START LEFT SIDEBAR NAV-->
<aside id="left-sidebar-nav">
<ul id="slide-out" class="side-nav fixed leftside-navigation">
<li class="user-details cyan darken-2">
<div class="row">
<div class="col col s4 m4 l4">
<img src="images/avatar.jpg" alt="" class="circle responsive-img valign profile-image"/>
</div>
<div class="col col s8 m8 l8">
<ul id="profile-dropdown" class="dropdown-content">
<li><i class="mdi-action-face-unlock"></i> Profile
</li>
<li><i class="mdi-hardware-keyboard-tab"></i> Logout
</li>
</ul>
<a class="btn-flat dropdown-button waves-effect waves-light white-text profile-btn" href="#" data-activates="profile-dropdown">John Doe<i class="mdi-navigation-arrow-drop-down right"></i></a>
<p class="user-roal">Administrator</p>
</div>
</div>
</li>
<li class="bold"><i class="mdi-action-dashboard"></i> Dashboard
</li>
<li class="no-padding">
<ul class="collapsible collapsible-accordion">
<li class="bold"><a class="collapsible-header waves-effect waves-cyan"><i class="mdi-action-view-carousel"></i> Settings</a>
<div class="collapsible-body">
<ul>
<h:form style="width:400px; margin-left:-20px;">
<f:ajax render=":content" >
<li><h:commandLink value="Register Classes" action="#{navigation.setPage('/pages/RegisterClasses.xhtml')}" class="mdi-action-dashboard" /></li>
<li><h:commandLink value="Register Subjects" action="#{navigation.setPage('/pages/RegisterSubjects.xhtml')}" class="mdi-action-dashboard" /></li>
<li><h:commandLink value="Register Teachers" action="#{navigation.setPage('/pages/RegisterTeachers.xhtml')}" class="mdi-action-dashboard" /></li>
<li><h:commandLink value="Assign Form Teachers" action="#{navigation.setPage('/pages/AssignFormTeachers.xhtml')}" class="mdi-action-dashboard" /></li>
<li><h:commandLink value="Assign Subject Teachers" action="#{navigation.setPage('/pages/AssignSubjectTeachers.xhtml')}" class="mdi-action-dashboard" /></li>
</f:ajax>
</h:form>
</ul>
</div>
</li>
</ul>
</li>
</ul>
<i class="mdi-navigation-menu"></i>
</aside>
<!-- END LEFT SIDEBAR NAV-->
<!-- //////////////////////////////////////////////////////////////////////////// -->
<!-- START CONTENT -->
<section>
<!--start container-->
<div class="container">
<div class="divider"></div>
<ui:insert name="content">
</ui:insert>
<!-- Floating Action Button -->
<div class="fixed-action-btn" style="bottom: 50px; right: 19px;">
<a class="btn-floating btn-large">
<i class="mdi-action-stars"></i>
</a>
<ul>
<li><i class="large mdi-communication-live-help"></i></li>
<li><i class="large mdi-device-now-widgets"></i></li>
<li><i class="large mdi-editor-insert-invitation"></i></li>
<li><i class="large mdi-communication-email"></i></li>
</ul>
</div>
<!-- Floating Action Button -->
</div>
<!--end container-->
</section>
<!-- END CONTENT -->
<!-- //////////////////////////////////////////////////////////////////////////// -->
<!-- START RIGHT SIDEBAR NAV-->
<aside id="right-sidebar-nav">
<ul id="chat-out" class="side-nav rightside-navigation">
<li class="li-hover">
<i class="mdi-navigation-close"></i>
<div id="right-search" class="row">
<form class="col s12">
<div class="input-field">
<i class="mdi-action-search prefix"></i>
<input id="icon_prefix" type="text" class="validate"/>
<label for="icon_prefix">Search</label>
</div>
</form>
</div>
</li>
</ul>
</aside>
<!-- LEFT RIGHT SIDEBAR NAV-->
</div>
<!-- END WRAPPER -->
</div>
<!-- END MAIN -->
<!-- //////////////////////////////////////////////////////////////////////////// -->
<!-- START FOOTER -->
<footer class="page-footer">
<div class="footer-copyright">
<div class="container">
<span>Copyright © 2015 <a class="grey-text text-lighten-4" href="" target="_blank">Nandom Gusen</a> All rights reserved.</span>
<span class="right"> Design and Developed by <a class="grey-text text-lighten-4" href="">Nandom Gusen</a></span>
</div>
</div>
</footer>
<!-- END FOOTER -->
<!-- ================================================
Scripts
================================================ -->
<!-- jQuery Library -->
<!-- <script type="text/javascript" src="#{resource['js/plugins/jquery-1.11.2.min.js']}"></script> -->
<!--materialize js-->
<script type="text/javascript" src="#{resource['js/materialize.min.js']}"></script>
<!--prism-->
<script type="text/javascript" src=" #{resource['js/plugins/prism/prism.js']}"></script>
<!--scrollbar-->
<script type="text/javascript" src="#{resource['js/plugins/perfect-scrollbar/perfect-scrollbar.min.js']}"></script>
<!-- chartist -->
<script type="text/javascript" src="#{resource['js/plugins/chartist-js/chartist.min.js']}"></script>
<!--plugins.js - Some Specific JS codes for Plugin Settings-->
<script type="text/javascript" src="#{resource['js/plugins.min.js']}"></script>
<!--custom-script.js - Add your own theme custom JS-->
<script type="text/javascript" src="#{resource['js/custom-script.js']}"></script>
<script type="text/javascript" src=" #{resource['js/plugins/data-tables/js/jquery.dataTables.min.js']}"></script>
<script type="text/javascript" src="#{resource['js/plugins/data-tables/data-tables-script.js']}"></script>
<script type="text/javascript">
/*Show entries on click hide*/
$(document).ready(function () {
$(".dropdown-content.select-dropdown li").on("click", function () {
var that = this;
setTimeout(function () {
if ($(that).parent().hasClass('active')) {
$(that).parent().removeClass('active');
$(that).parent().hide();
}
}, 100);
});
});
</script>
</h:body>
</html>
BELOW IS THE NAGIVATION BEAN
package com.nan.app.navigation;
import java.io.Serializable;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
/**
*
* #author Nandom
*/
#ManagedBean(name = "navigation")
public class NavigationBean implements Serializable {
public static final long serialVersionUID = 1L;
public String page;
#PostConstruct
public void init() {
page = "/pages/RegisterClasses.xhtml"; // Default include.
// page = "/template/default/content-layout.xhtml?";
}
public String getPage() {
return page;
}
public void setPage(String page) {
this.page = page;
}
}
This application works well, but the first view(RegisterClassex.xhtml) is the view that will work well. Other views like RegisterSubject.xhtml will not be able to communicate with its own bean.
What could be the problem?
Thanks #Kukeltje for your contributions towards the success of this application and for helping me to solve a major error that has hindered my progress for many days. I have figured out the problem. I added the annotaion #SessionScoped to my navigation bean and it solved the problem. Below is the code that solved the problem
package com.nan.app.navigation;
import java.io.Serializable;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
/**
*
* #author Nandom
*/
//#Named("navigation")
#ManagedBean(name = "navigation", eager = true)
#SessionScoped
public class NavigationBean implements Serializable {
public static final long serialVersionUID = 1L;
public String page;
#PostConstruct
public void init() {
page = "/pages/RegisterSubjects.xhtml"; // Default include.
// page = "/template/default/content-layout.xhtml?";
}
public String getPage() {
return page;
}
public void setPage(String page) {
this.page = page;
}
}
But i noticed another problem. whenever i navigate to a new view page, the Popup Dialog doesnt come up with the first click, i have to click the button the second time before the popup Dialog comes up. What could probably be the cause of this problem?
Trying to implement Worldpay integration. The docs at https://online.worldpay.com/docs/take-card-details-templates mention a token. I have tested the page and I dont get any token. Wandering how i can get this token.
<%# Page Language="C#" AutoEventWireup="true" CodeFile="payment2.aspx.cs" Inherits="payment2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src= "https://cdn.worldpay.com/v1/worldpay.js">
</script>
<script type='text/javascript'>
window.onload = function () {
Worldpay.setClientKey('T_C_a453a70e-c5e6-4618-9c7b-96f787f0fa04');
Worldpay.reusable = false;
Worldpay.useTemplate('payment-form', 'my_payment_section', 'inline');
}
</script>
</head>
<body>
<form action="/complete" id="payment-form" method="post">
<!— all other fields you want to collect, e.g. name
and shipping address -->
<div id='my_payment_section'></div>
<div>
<input type="submit" value="Place Order" />
</div>
</form>
</body>
</html>
When the window.onload executes, it puts the WorldPay card capture form on your page. By the looks of it, you haven't disabled their Save Payment button, so are you trying to use your own submit button?? If you are trying to use your submit button, then you should add the onclick attribute to submit the worldpay template.
<input type="submit" value="Place Order" />
<form action="/complete" id="payment-form" method="post">
<div id="my_payment_section"></div>
<div>
<input id="submitCard" onclick="Worldpay.submitTemplateForm()" value="Confirm Payment" />
</div>
</form>
Once the form submits, worldpay.js takes over, and it will handle the sensitive card information, validate it and if all is ok, it will replace the cardDetails div with a single hidden input field which is the token.
If that all happens correctly, with no errors, after the token input has been placed in the DOM, the form will submit to your action "/complete", and the token will be part of the submitted values of the form.
Hope that helps.
Your script is missing the callback to generate the token in useTemplate()
See: https://developer.worldpay.com/jsonapi/docs/template-form
The callback generates the hidden input with the token value for you which posts to worldpay.
your script should be:
<script type='text/javascript'>
window.onload = function() {
Worldpay.useTemplateForm({
'clientKey':'T_C_a453a70e-c5e6-4618-9c7b-96f787f0fa04',
'form':'paymentForm',
'paymentSection':'paymentSection',
'display':'inline',
'reusable':false,
'callback': function(obj) {
if (obj && obj.token) {
var _el = document.createElement('input');
_el.value = obj.token;
_el.type = 'hidden';
_el.name = 'token';
document.getElementById('paymentForm').appendChild(_el);
document.getElementById('paymentForm').submit();
}
}
});
}
</script>
You also need the onclick="Worldpay.submitTemplateForm()" attribute on your submit too.
I have a problem and i was wondering if anyone can help me. Any help is really appreciated. And i m sure that its an 'easy' question.
I have a jsp page that shows dynamic data in tables, my problem is that the page has multiple tables.
But i want to export to excel only a specific table with a specific id.
So far i m exporting to excel all data from the jsp page which is wrong, cause i want to export only one table with id="formAssignDemands", how can i do it ?
Here is my code,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%# page contentType="text/html;charset=windows-1253"%>
<%# taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%# taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%# taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>
<%# taglib uri="https://ajax4jsf.dev.java.net/ajax" prefix="a4j"%>
<f:view>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1253"/>
<f:loadBundle basename="bundles.requests" var="FieldsDescr"/>
<f:loadBundle basename="bundles.messages" var="GeneralMessages"/>
<title>
<h:outputText value="#{FieldsDescr.AssignRequests_Title}"/>
</title>
<a4j:loadStyle src="#{AssignDemands_backing.municipality.url}#{AssignDemands_backing.municipality.templateId}#{GeneralMessages.CssPath}"/>
<script language="JavaScript" type="text/javascript"
src="./demands.js"></script>
<script language="JavaScript" type="text/javascript"
src="../reports/reports.js"></script>
</head>
<body><h:form>
<jsp:include page="/system/NavigationMenu.jsp"/>
</h:form>
<%
String exportToExcel = request.getParameter("exportToExcel");
if (exportToExcel != null && exportToExcel.toString().equalsIgnoreCase("YES")) {
response.setContentType("application/vnd.ms-excel");
response.setHeader("Content-Disposition", "inline; filename="
+ "excel.xls");
}
%>
<table cellspacing="0" cellpadding="0" border="0"
width="99%" align="center">
<tr>
<td class="componentheading" width="99%">
<h:outputText value="#{FieldsDescr.AssignRequests_SubHeader}"/>
</td>
<td class="componentheading" width="1%">
<table>
......
<tr>
<td class="main_component_seperator" colspan="2"> </td>
</tr>
<tr>
<td align="center" colspan="2">
<h:form id="formAssignDemands">
<t:dataTable id="demandsDataTable"
binding="#{AssignDemands_backing.demandsDataTable}"
var="demand"
value="#{AssignDemands_backing.unassignedDemandsList}"
rows="#{NavigationMenu_backing.rows}"
varDetailToggler="detailToggler"
sortColumn="#{AssignDemands_backing.sort}"
sortAscending="#{AssignDemands_backing.ascending}"
preserveSort="true"
headerClass="datatable_td_header"
rowClasses="tablerow1, tablerow2"
width="100%"
rowIndexVar="demandsRowIndex">
<f:facet name="header">
<h:panelGroup>
<f:verbatim>
<div style="float:left;"></div>
</f:verbatim>
<h:panelGrid columns="4"
cellspacing="2">
<h:outputText value="#{GeneralMessages.DataTable_RowsPerPage}"/>
.....
</table>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<%
if (exportToExcel == null) {
%>
Export to Excel
<%
}
%>
</body>
</html>
</f:view>
<%-- oracle-jdev-comment:auto-binding-backing-bean-name:AssignRequests--%>
Thank you guys for any help or any idea,,
i managed to do it with javascript and is working on 3 basic browsers mozilla, chrome and IE11 , so here it is,
<script type="text/javascript">
function ExcelReport()
{
var tab_text="<table border='2px'><tr bgcolor='#FFFFFF'>";
var textRange; var j=0;
tab = document.getElementById('table_id'); // id of table
for(j = 0 ; j < tab.rows.length ; j++)
{
tab_text=tab_text+tab.rows[j].innerHTML+"</tr>";
}
tab_text=tab_text+"</table>";
tab_text= tab_text.replace(/<A[^>]*>|<\/A>/g, "");
tab_text= tab_text.replace(/<img[^>]*>/gi,"");
tab_text= tab_text.replace(/<input[^>]*>|<\/input>/gi, "");
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))
{
txtArea1.document.open("txt/html","replace");
txtArea1.document.write(tab_text);
txtArea1.document.close();
txtArea1.focus();
sa=txtArea1.document.execCommand("SaveAs",true,"Excel.xls");
}
else
sa = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));
return (sa);
}
</script>
and to call it somewere in your body can add the following with an iframe, like that,
<iframe id="txtArea1" style="display:none"></iframe>
<button id="btnExport" class="button_class" onclick="ExcelReport();">Export to Excel</button>
thats it , thank you guys for reading
I have to make a draggable/moveable lightbox iframe
lightBox code:
<p:lightBox id="draggable" iframe="true" width="910px" height="500px" style="overflow:none" widgetVar="dlg" iframeTitle="flight">
<h:outputLink value="/airProject/flightBooking.xhtml" title="flight" styleClass="LinkButton">
</h:outputLink>
</p:lightBox>
Tried this(for moving)
<p:draggable for="draggable" />
and also this too:
<script type="text/javascript">
$(function() {
$( "#draggable" ).draggable();
});
</script>
But these are moving button not iframe popup. So how do drag/move the iframe lighbox popup as we move p:dialog?
Assuming your lightBox's widgetVar is: lightBoxWV
<script type="text/javascript">
$(function() {
PF('lightBoxWV').panel.draggable()
});
</script>
Hope this helps.
My new task is to have PrimeFaces <p:messages> dissappear after 5 seconds after appearing. I haven't found any specific setting for that in PF's user guide, nor on their webpage. I thought maybe I could bind an JavaScript event to <p:messages> appearing, but don't know where to start.
My messages are in the Template:
<p:messages id="messages" globalOnly="true" autoUpdate="true" closable="true" rendered="#{not suppressMessages}" />
and render such an empty <div> in DOM:
<div id="messages" class="ui-messages ui-widget" aria-live="polite"></div>
and full:
<div id="messages" class="ui-messages ui-widget" aria-live="polite">
<div class="ui-messages-info ui-corner-all">
<a class="ui-messages-close" onclick="$(this).parent().slideUp();return false;" href="#">
<span class="ui-messages-info-icon"></span>
<ul>
<li>
<span class="ui-messages-info-summary">Sample info message</span>
</li>
</ul>
</div>
</div>
Does anyone know of a jQuery or Primefaces specific solution?
Solution
I've found the combination of jQuery and <p:ajaxStatus> to be the solution to my problem. I've added:
<p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="setTimeout(function() { $('.ui-messages').slideUp(); }, 5000); PF('statusDialog').hide();" />
to my <p:ajaxStatus> and some jQuery in case of non ajax messages.
jQuery(document).ready(function() {
if(!$.trim($(".ui-messages").html())==''){
//console.log("messages found");
setTimeout(function() {$('.ui-messages').slideUp();}, 5000);
} else {
//console.log("messages not found");
}
});
Thanks for the lead BalusC!
You can use <p:ajaxStatus> to hook on ajax start, complete, success and error events. You can then just fire a setTimeout() on a slideUp() of the messages.
<p:ajaxStatus oncomplete="setTimeout(function() { $('.ui-messages').slideUp(); }, 5000)" />
Or, more generically, you could also use jQuery's $.ajaxStop() for this.
$(document).ajaxStop(function() {
setTimeout(function() {
$('.ui-messages').slideUp();
}, 5000);
});