JSF/ Javascript Date Picker

Has anyone incorporated a javascript date picker with JSF? if so how did you handle the fact that the inputText for jsf doesn't have a name and is in the form of <h:inputText>? Any help would be appreciated, Thanks.

Did you look at the ADF Faces Date picker as an option?
http://www.oracle.com/technology/products/jdev/htdocs/partners/addins/exchange/jsf/doc/tagdoc/core/chooseDate.html
or
http://www.oracle.com/technology/products/jdev/htdocs/partners/addins/exchange/jsf/doc/tagdoc/core/selectInputDate.html

Similar Messages

How to integrate a java script date picker with jsf?

Hi I have a javascript data picker which I want to integrate with a text tield.. that is <jsf:inputtext tag...
I know about onlclick .. but I am more interested in knowing .. how will the java script set date into that input text field.. i mean how will it recognize the field..

Pass the input element as 'this' reference to the JS function?onclick="doSomething(this);"This has not much to do with JSF though.

Read only date picker in an updatable query

Dear all,
There is a date picker component in my application. I need to disable data entry or any changes in a known condition. However when I create a dynamic action it only make the text field readonly.
__Please be advised that the date picker is in an up-datable query__ .
It also would be practical if I would be able to hide the javascript date picker button.
regards

Solved my problem by adding the following codes into the datepicker javascript:
if (document.getElementById(dateFieldName).readOnly)
return false;

Date picker in portal.

Can anyone give any assistance on portal form naming conventions?
I am trying to implement a date pickerr in portal. I've got the
calendar to come up in a new window but can't get it to return
the value to the date field. I think i may be using the wrong
syntax for the javascript function. I am getting the following
error when clicking on a date:
JavaScript Error:
http://ITCuA:7777/pls/portal30/PORTAL30.wwa_app_module.show?p_ses
sionid=668,
line 604:
document.GOV_LEAVE_FORM_1 has no properties.
This is used in a function defined in the calling window:
function restart() {
document.GOV_LEAVE_FORM_1.dateField.value = '' + padout(day)
+ '/' + padout(month - 0 + 1) + '/' + year;
frmCAL.close();
Am i reeferencing this correctly?
David Tatum

I had similar problems with a Javascript date picker. Portal
generates unique names for all form fields at runtime, and you
can't reference the form field names as entered in the form
designer (they're not the ones used).
Use the 'View | Source' function in the browser to see all INPUT
fields, and start counting until you find the field you want to
write to.
Using the Javascript document object model (DOM), - reference
the field as indexes into the document array (i.e. forms
[0].elements[14]).
Also note that Portal generates hidden fields in addition to the
ones you put on your form, - that's why you have to step through
the generated source in order to correctly index your form
fields.
Regards,
-Haakon-

How to insert a date picker input text field in a JSF Jsp page

Hi,
I have to develop an application using generic facets, unfortunately I am not supposed to use ADF Faces components given by Oracle.
Now my requirement is, on JSP page an input text field which holds a DATE value is required, it should also have a Date Picker Calendar adjacent to it.
Could you pls shed some light on this issue and help me out.
Thanks
~Siva(ji)

<HTML>
<script language="JavaScript" type="text/javascript">

</script>
<BODY
<button id="c1" onclick="cstmPup(c1,pUpCstm)">Custom PopUp</button>
<'div' id="pUpCstm" style="display:none;">
<'div' id="myid" align="left" style=" width:100%; height:100%; background:#cccccb; border:1px solid black; border-top:1px solid white; border-left:1px solid white; padding:10px; font:normal 10pt tahoma; padding-left:18px "> <b>Rich Message Boxes</b>
<hr size="1" style="border:1px solid black;">
     <div style="width:220px; font-family:tahoma; font-size:80%; line-height:1.5em"><br>
          <table border ="1" id="myTable">
               <TR>
                    <TD> SUN </TD>
                    <TD> MON </TD>
                    <TD> TUE </TD>
                    <TD> WED </TD>
                    <TD> THU </TD>
                    <TD> FRI </TD>
                    <TD> SAT </TD>
               </TR>
          </table>
     <br><br>
     </div>
     <br>
     <div>
<button tabindex="-1" onclick="hPopUpc()" style="border:1px solid black; border-left:1px solid white; border-top:1px solid white; background:#cccccc ">Close Message</button>
</div>
<?BODY
</HTML>
Message was edited by:
mchepuri
Message was edited by:
mchepuri
Message was edited by:
mchepuri

UIX Javascript Error with Date Picker

Hi all,
I am using JDeveloper 10.1.2.1.0 with JHeadstart 10.1.2.2.32 to create UIX pages. I have a page with a filter by search field. If I select the date picker on this page in IE version 6 or 7, I get the following javascript error:
Error: 'length' is null or not an object
I have found this in the Common2_2_20.js, which is part of the jslibs
function _accumulateNumber(
a0,
a1
var a2=a0.currIndex;
var a3=a2;
var a4=a0.parseString;
***var a5=a4.length;***
if(a5>a3+a1)
a5=a3+a1;
var a6=0;
while(a3<a5)
var a7=parseDigit(a4.charAt(a3));
if(!isNaN(a7))
a6*=10;
a6+=a7;
a3++;
else
break;
if(a2!=a3)
a0.currIndex=a3;
return a6;
else
return(void 0);
}With Firefox 1.5.0.4, I can get the date selector window to open, but when I select a date value, I get this javascript error:
a0.select() is not a function
I have found this in the Common2_2_20.js also. Here is the code where the error is occuring.
function _dfsv(
a0,
a1
if((a0==(void 0))||(a1==(void 0)))
return;
a1+=_getTimePortion(a0);
var a2=new Date(a1);
var a3=_getDateFieldFormat(a0);
var a4=a0.value;
var a1=a3.format(a2);
if(a0.value!=a1)
if(a0.onchange!=(void 0))
if(_agent.isIE)
a0.onpropertychange=function()
var a5=window.event;
if(a5.propertyName=='value')
a0.onpropertychange=function(){};
a0.onchange(a5);
a0.value=a1;
else
a0.value=a1;
var a5=new Object();
a5.type='change';
a5.target=a0;
a0.onchange(a5);
else
a0.value=a1;
***a0.select();****
a0.focus();
}I am able to use the date picker on other pages and even different parts of this page. The date search field is of type dateField.and is part of a switcher. Does anyone have any ideas as to why this is occuring or how I can work around it? Thanks in advance. I really appreciate all of your help.
Susan

Thanks for the reply. As a matter of fact, in my case the error happens in a UIX page generated by JHeadstart. I did some JavaScript debugging using the FireBug Firefox entension and I found that it is some JHeadstart JavaScript that causes this problem.
The JHeadstart JavaScript passes on an array of input elements to the AFD JavaScript function and the problem arises when the select() method is called on the array, rather than an input element in the array.
I will try to solve my issue by modifying the JHeadstart JavaScript code. Please see the JHeadstart forum somewhere in the near future for my post(s) about this :-)
Thanks, Wouter

Javascript-disabled date picker items

If I disable a Date Picker item via Javascript the user can still enter a date into it via the calendar pop-up: I want to prevent this. Is there any easy way to do so? All I can think of currently is to build my own date picker functionality, with the icon as an item that I can hide or show via Javascript.

Hello,
Following Carl’s idea, the following should allow you to disable/enable a date picker item:
function toggleDatePicker (pThis, pDisable) {
var lNode = $x_UpTill(pThis,'TR');
lNode.disabled = pDisable;
var lNode = $x_UpTill(pThis,'TD');
var lA = lNode.getElementsByTagName('A');
if(pDisable){
    if(lA[0].getAttribute('href')){
       lA[0].setAttribute('onclickoff',lA[0].getAttribute('href'));
       lA[0].setAttribute('href','javascript: void(0);');
}else{
   if(lA[0].getAttribute('onclickoff')){
     lA[0].setAttribute('href',lA[0].getAttribute('onclickoff'));
}pThis is the date picker item name. pDisable set to true will disable the item, and false will enable it.
Although the user can enter a date into the field, it’s still disabled. That means that this item will not be POSTed to the server and will not be set in session state.
Hope it helps,
Arie.

Date picker for af:inputDate is not picking up the correct input date

view source:
<af:inputDate value="#{bindings.DateField.attributeValue}" label="#{bindings.DateField.hints.label}"
required="#{bindings.DateField.hints.mandatory}"
valueChangeListener="#{pageFlowScope.CollectApplicantInformation.datesItemChanged}"
columns="#{bindings.DateField.hints.displayWidth}" shortDesc="#{CustomTooltip[DateField]}"
autoSubmit="true" helpTopicId="AppDt" id="DateField" simple="true">
<f:validator binding="#{bindings.DateField.validator}"/>
*<f:converter converterId="CustomConverter"/>*
</af:inputDate>
Here I am not using <af:ConvertDateTime> insted using customConverter, so what code changes do I need to make sure the date picker always picks the already existind date in the inputDate rather picking the current date?
Here is my CustomConverter.java
CustomConverter.java
public class CustomConverter extends DateTimeConverter implements ClientConverter, Converter
public Object getAsObject(FacesContext context, UIComponent component, String value)
String dataType = (String) resolveExpression("#{bindings." + component.getId() + ".attributeDef.javaType.name}");
if (dataType != null && !dataType.equalsIgnoreCase("oracle.jbo.domain.Date") && !dataType.equalsIgnoreCase("oracle.jbo.domain.Timestamp"))
String test = null;
if (context == null || component == null)
throw new NullPointerException();
if (value != null)
// To solve DB transaction dirty issue, Check isEmpty and return null.
if (value.isEmpty())
return null;
// the "value" is stored on the value property of the component.
// The Unified EL allows us to check the type
ValueExpression expression = component.getValueExpression("value");
if (expression != null)
Class<?> expectedType = expression.getType(context.getELContext());
if (expectedType != null)
System.out.println("expectedType Value:::" + expectedType.getName());
// try to convert the value (Object) to the TYPE of the "value" property
// of the underlying JSF component
try
return TypeFactory.getInstance(expectedType, value);
catch (DataCreationException e)
String errorMessage;
if (expectedType.equals(CustomNumber.class))
errorMessage = "You can enter only Numbers in this field";
else
errorMessage = e.getMessage();
if (errorMessage != null)
FacesContext ctx = FacesContext.getCurrentInstance();
FacesMessage fm = new FacesMessage(FacesMessage.SEVERITY_ERROR, "Invalid Format" , errorMessage);
ctx.addMessage(component.getClientId(), fm);
catch (CustomDomainException e)
int errorCode = e.getErrorMessageCode();
String[] errorMessage = e.getErrorMessageParams();
if (errorCode == 7 && errorMessage != null)
String msg = "Invalid " + errorMessage[0];
FacesContext ctx = FacesContext.getCurrentInstance();
FacesMessage fm = new FacesMessage(FacesMessage.SEVERITY_ERROR, "Application Error: ", msg);
ctx.addMessage(component.getClientId(), fm);
catch (JboException e)
Throwable cause = e.getCause();
if (cause == null)
cause = e;
test = "not good format";
throw e;
return null;
else
return value != null? value: null;
public String getAsString(FacesContext context, UIComponent component, Object value)
return value != null? value.toString(): null;
public String getClientLibrarySource(FacesContext context)
return null;
@Override
public Collection<String> getClientImportNames()
return Collections.emptySet();
@Override
public String getClientScript(FacesContext context, UIComponent component)
String formatMask = (String) resolveExpression("#{bindings." + component.getId() + ".format}");
if (formatMask != null)
String dataType = (String) resolveExpression("#{bindings." + component.getId() + ".attributeDef.javaType.name}");
if (dataType.equalsIgnoreCase("oracle.jbo.domain.Date") || dataType.equalsIgnoreCase("oracle.jbo.domain.Timestamp"))
if (component == null)
_LOG.severe("The component is null, but it is needed for the client id, so no script written");
return null;
// Add a JavaScript Object to store the datefield formats
// on the client-side. We currently store the format string
// for each and every field. It'd be more efficient to have
// an array of formats, then store for each field the
// index of the format, especially if we could delay outputting
// these objects to when the <form> closes.
String clientId = component.getClientId(context);
if (clientId != null)
// =-=AEW Only if Javascript...
Map<String, Object> requestMap = context.getExternalContext().getRequestMap();
// this fetch could be at the place where we append, but has been
// moved ahead to optimize use of StringBuilder
String jsPattern = getJSPattern(context, component);
String loc = _getLocaleString(context);
// FIX - figure out size!!!
// 127 chars for javascript + length of jspattern + locale + 12 chars for
// tranforming to name in the worst case.
StringBuilder buff = new StringBuilder(139 + jsPattern.length() + loc.length());
if (requestMap.get(_PATTERN_WRITTEN_KEY) == null)
requestMap.put(_PATTERN_WRITTEN_KEY, Boolean.TRUE);
// only create the _dfs object if it doesn't exist, so we don't
// wipe out _dfs[xxx] values if we ppr the first date field on a
// page with multiple date fields.
buff.append("if(window['_dfs'] == undefined){var _dfs=new Object();}if(window['_dl'] == undefined){var _dl=new Object();}");
buff.append("_dfs[\"");
buff.append(clientId);
buff.append("\"]=");
buff.append(jsPattern);
buff.append(";");
buff.append("_dl[\"");
buff.append(clientId);
buff.append("\"]=");
buff.append(loc);
buff.append(";");
return buff.toString();
else
LOG.severe("NULLCLINET_ID_NO_SCRIPT_RENDERED");
return null;
else
return null;
else
return null;
private String _getLocaleString(FacesContext context)
Locale dateTimeConverterLocale = getLocale();
if (dateTimeConverterLocale != null)
Locale defaultLocale = RenderingContext.getCurrentInstance().getLocaleContext().getFormattingLocale();
if (!(dateTimeConverterLocale.equals(defaultLocale)))
String loc = dateTimeConverterLocale.toString();
StringBuffer sb = new StringBuffer(2 + loc.length());
sb.append("'");
sb.append(loc);
sb.append("'");
return (sb.toString());
return "null";
@Override
@Deprecated
public String getClientConversion(FacesContext context, UIComponent component)
String formatMask = (String) resolveExpression("#{bindings." + component.getId() + ".format}");
if (formatMask != null)
String dataType = (String) resolveExpression("#{bindings." + component.getId() + ".attributeDef.javaType.name}");
if (dataType.equalsIgnoreCase("oracle.jbo.domain.Date") || dataType.equalsIgnoreCase("oracle.jbo.domain.Timestamp"))
String jsPattern = getJSPattern(context, component);
Map<String, String> messages = new HashMap<String, String>();
if (jsPattern != null)
Class<?> formatclass = formatMask.getClass();
System.out.println("FormatClass::" + formatclass);
System.out.println(" Format Mask : " + formatMask);
// SimpleDateFormat sdfDestination = new SimpleDateFormat(formatMask);
String pattern = formatMask; //getPattern();
if (pattern == null)
pattern = getSecondaryPattern();
String key = getViolationMessageKey(pattern);
Object[] params = new Object[]
{ "{0}", "{1}", "{2}" };
Object msgPattern = getMessagePattern(context, key, params, component);
//if hintFormat is null, no custom hint for date, time or both has been specified
String hintFormat = _getHint();
FacesMessage msg = null;
String detailMessage = null;
if (msgPattern != null)
msg = MessageFactory.getMessage(context, key, msgPattern, params, component);
detailMessage = XhtmlLafUtils.escapeJS(msg.getDetail());
Locale loc = context.getViewRoot().getLocale();
SimpleDateFormat formatter = new SimpleDateFormat(pattern, loc);
java.lang.Object obj = resolveExpression("#{bindings." + component.getId() + ".attributeValue}");
String databaseDate=null;
if(obj!=null)
databaseDate = obj.toString();
DateFormat df = new SimpleDateFormat(pattern,loc);
System.out.println("DateComponent input value :::::::::::::::::::::::::"+databaseDate);
Date today;
try {
// System.out.println("Before Conversion::::::::::::"+df.parse(databaseDate).toString());
if(databaseDate!=null)
today = df.parse(databaseDate);
else
today = new Date();
System.out.println("After Conversion Date :::::::::::::::::::::::::::::"+today.toString());
//Date today = new Date();
String dt = formatter.format(today);
String exampleString = dt;
String escapedType = XhtmlLafUtils.escapeJS(getType().toUpperCase());
StringBuilder outBuffer = new StringBuilder();
outBuffer.append("new TrDateTimeConverter(");
outBuffer.append(jsPattern);
// loc = getLocale();
if (loc != null)
outBuffer.append(",'");
outBuffer.append(loc.toString());
outBuffer.append("','");
else
outBuffer.append(",null,'");
outBuffer.append(exampleString);
outBuffer.append("','");
outBuffer.append(escapedType);
outBuffer.append("'");
if (msgPattern != null || hintFormat != null)
messages.put("detail", detailMessage);
messages.put("hint", hintFormat);
outBuffer.append(',');
// try
// JsonUtils.writeMap(outBuffer, messages, false);
// catch (IOException e)
// outBuffer.append("null");
outBuffer.append(')'); // 2
return outBuffer.toString();
catch(ParseException e)
System.out.println("Parse Exception :::::::::::::::::::::"+e);
return null;
else
// no pattern-matchable date
return null;
else
return null;
else
return null;
protected String getJSPattern(FacesContext context, UIComponent component)
String jsPattern = null;
String datePattern = (String) resolveExpression("#{bindings." + component.getId() + ".format}");
if (datePattern != null)
String secondaryPattern = getSecondaryPattern();
if (datePattern != _NO_JS_PATTERN)
int length = datePattern.length() * 2 + 2;
if (secondaryPattern != null)
length = length + 3 + secondaryPattern.length() * 2;
StringBuilder outBuffer = new StringBuilder(length);
jsPattern = _getEscapedPattern(outBuffer, datePattern, secondaryPattern);
else
jsPattern = datePattern;
return jsPattern;
private static void _escapePattern(StringBuilder buffer, String pattern)
buffer.append('\'');
XhtmlUtils.escapeJS(buffer, pattern);
buffer.append('\'');
private static String _getEscapedPattern(StringBuilder buffer, String pattern, String secondaryPattern)
if (secondaryPattern != null)
buffer.append('[');
_escapePattern(buffer, pattern);
if (secondaryPattern != null)
buffer.append(",'");
XhtmlUtils.escapeJS(buffer, secondaryPattern);
buffer.append("']");
return buffer.toString();
private String _getHint()
String type = getType();
if (type.equals("date"))
return getHintDate();
else if (type.equals("both"))
return getHintBoth();
else
return getHintTime();
public static Object resolveExpression(String pExpression)
FacesContext facesContext = FacesContext.getCurrentInstance();
Application app = facesContext.getApplication();
ExpressionFactory elFactory = app.getExpressionFactory();
ELContext elContext = facesContext.getELContext();
ValueExpression valueExp = null;
valueExp = elFactory.createValueExpression(elContext, pExpression, Object.class);
return valueExp.getValue(elContext);
private static final String _NO_JS_PATTERN = new String();
private static final TrinidadLogger _LOG = TrinidadLogger.createTrinidadLogger(DateTimeConverter.class);
// RenderingContext key indicating the _dateFormat object
// has been created
private static final String _PATTERN_WRITTEN_KEY = "org.apache.myfaces.trinidadinternal.convert.DateTimeConverter._PATTERN_WRITTEN";
*Problem is if any input date componet is displaying other than current date then the date picker is always picking the current date rather existing date*
Please suggest me where to make changes?
Edited by: 858782 on Oct 3, 2011 7:43 AM
Edited by: 858782 on Oct 3, 2011 11:44 PM

I need custom date foramts to be applied for different inputDates which are not defined in <af:convertDateTime>
Thanks
Edited by: 858782 on Oct 13, 2011 4:59 PM

Date picker missing

I have a form made up of a table. In one row I have a date picker. Unfortunately, I need to hide this row before the page load up. When a radio is picked, then this date picker row will show. However, when the row shows, the date picker does not appear. Why is this and how can I get around this issue?
<h:inputText id="text2" styleClass="inputText">
<hx:convertDateTime />
<hx:inputHelperDatePicker />
</h:inputText>

It will help others if you mention the specific component used. It's a Sun forum here, expecting discussions about the Sun JSF RI components (the h: components). You're talking about the IBM Faces Client Framework component (the hx: components).
How is the row displayed/hidden? Clientside or serverside? I guess it's clientside and that there may be something wrong in the Javascript (as always with those IBM components). Run a Javascript debugger and take a look. The Venkman JS debugger extension for Firefox is a nice one. If you still get stucked and don't get any response here, try the IBM developerworks forums.

Date Picker error

Hi,
We have an application that cannot use the date picker, after a date is selected, the error we get is:
A runtime error has occurred
Line:10
Error: 'opener.document.forms.0.p_t03' is null or not an object
After a lot of searching around, the developer has narrowed it down to something on the template for some reason, but we are not sure what. If we remove the template, it works fine - but in this case the business wants the standard look and feel - so we are stuck with having to use it.
Below is the header, body and footer sections of the offending template - anyone have any idea of what could cause the problem with the date picker?
Header:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>#TITLE#</title>
#HEAD#
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="Monash University Research Output Reporting Tool" />
<meta name="keywords" content="research, RORT, reporting" />
<link rel="stylesheet" href="http://assets.monash.edu.au/styles/monash.css" type="text/css" />
<link rel="stylesheet" href="http://assets.monash.edu.au/styles/print.css" media="print" type="text/css" />
<link rel="shortcut icon" href="http://www.monash.edu.au/favicon.ico" />
<link rel="stylesheet" href="#IMAGE_PREFIX#css/einstein.css" type="text/css" />
<script src="#IMAGE_PREFIX#javascript/functions.js" type="text/javascript"></script>
</head>
<div id="accessibility">
Skip to content | Change text size
</div>
<div class="spacer"></div>

<div id="global-header">
<div id="global-images">
<img id="logo" src="http://assets.monash.edu.au/images/logo.gif" width="343" height="79" alt="Monash University" /><img id="banner-image" src="http://assets.monash.edu.au/images/banner-research.jpg" width="288" height="79"
alt=" " title="" />
</div>
<div class="spacer"></div>

<table id="global-nav" summary="Layout for site-wide navigation">
<tr><td>
Monash home | About Monash | Faculties | Campuses | <a
href="http://www.monash.edu.au/contact/">Contact Monash</a>
</td></tr>
</table>

<table id="global-utils" summary="Layout for utility navigation">
<tr>
<td>
Staff directory | A-Z index | Site map
</td>
<td id="global-utils-form">
<form action="http://ultraseek.its.monash.edu.au/query.html" method="get" name="seek1" id="seek1">
<input type="hidden" name="rq" value="0" />
<input type="hidden" name="col" value="m0" />
<input type="hidden" name="qs" value="-monash.access:intranet -monash.access:emailarchive" />
<label class="search" for="qt">SEARCH </label>
<input type="text" id="qt" name="qt" size="20" maxlength="1024" />
<input type="hidden" name="qp" value="" />
<input name="submit" type="submit" accesskey="1" value="Go" />
</form>
</td>
</tr>
</table>
<body #ONLOAD#>#FORM_OPEN#
<H1><CENTER>MRGS EXAMINATIONS</CENTER></H1>
Body:

<a name="content" id="skiplink"></a>
<div align="right">
<table class="std">
<tr><td align="left" width="10%" valign="bottom" nowrap="nowrap"><span class="PortletHeading2">&USER.</span></td><td style="padding-left:30px;">#NOTIFICATION_MESSAGE# #SUCCESS_MESSAGE#</td></tr></table>
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="TabForegroundColor">
<tr><td class="TabForegroundColor"><img src="#IMAGE_PREFIX#f_spacer.gif" border="0" height="3" alt="" /></td></tr>
</table></div>
</td>
</tr>
<tr>
<td width="100%" colspan="3">
<div class="th_content_body">
#REGION_POSITION_01#
<tr>
<td style="padding-right:10px;padding-left:10px;" valign="top">#REGION_POSITION_02#
</td>
</tr>
<table width="100%">
<tr><br>
<td width="25%" style="border-right:2px #000099 solid;padding-left:10px;" valign="top">#REGION_POSITION_03#
</td>
<td style="padding-right:10px;padding-left:10px;" valign="top">#REGION_POSITION_04#
</td>
<td valign="top" width="100%" style="padding-left:20px;padding-left:20px;">
#BOX_BODY#</td>
</tr>
<tr>
<td></td>
<td style="border-style:solid;border-width:thin;border-color:black;padding-right:10px;padding-left:10px;" valign="top">#REGION_POSITION_07#
</td>
</tr>
</table>
</div>
#REGION_POSITION_09#
</td>
</tr>
<tr>
</table>
Footer:
#FORM_CLOSE#
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="TabForegroundColor"><tr>
<td class="TabForegroundColor"><img src="#IMAGE_PREFIX#f_spacer.gif" border="0" height="3" alt="" /></td></tr>
</table>
<table width="100%"><tr><td align="right" class="tiny"> #CUSTOMIZE# </td></tr></table>
Copyright © 2003 <FONT COLOR=#606060><U>Monash University</U></FONT> ABN 12 377 614 012 - <FONT COLOR=#606060><U>Caution</U></FONT> - <FONT COLOR=#606060><U>Privacy</U></FONT> - <FONT COLOR=#606060><U>CRICOS
Provider Number: 00008C</U></FONT>
Last updated: 10 August 2004 - Maintained by <FONT COLOR=#606060><U>[email protected]</U></FONT> - <FONT COLOR=#606060><U>Accessibility information</U></FONT>
</body>
</html>

i think the calendar runs through a specific dll file. you may want to search to make sure all the dlls are installed. or re-install the software

How can I get a date picker or wheel to show up in the form to make filling in a form with a lot of

how can I get a date picker or wheel to show up in the form to make filling in a form with a lot of dates more easy?

There is no built-in date picker available for forms created in Acrobat. There are some third-party solutions involving JavaScript (either a large collection of fields or a custom dialog) though. Also, text fields with date formatting will use a wheel type date picker on Android/iOS devices with Adobe Reader.

Inserting a Value into otherTable using an App. Proc. from a Date Picker

I'm trying to call an Application Process that will insert an Attribute of a Row, into another table, after selecting a date from a Date Picker cell.
I don't know why this shouldn't be possible. I think I've got all of my "Ducks in a Row", so to speak,
but the Value that is being inserted into the other table is this:.. [object HTMLTableCellElement]
(Ultimately, I'd like my Application Process to include Page element values with the insert as well, but I'm trying to handle one problem at a time)
Here's a list of all the steps I've covered:
1. I've Created an Application Process, (popDevices). The Process Point is "On-Demand". The Type is "PL/SQL Anonymous Block".
The Process is defined as such:
BEGIN
Insert into P_DEVICES
NAME,
IP_ADDRESS,
MODEL
) values
'Unassigned',
'Unassigned',
:P153_MODEL
COMMIT;
END;
2. I've Included the Javascript in the Page HTML Header.
The Javascript is written as such: (minus the tags)
function popDevices(PART_NO)
var get = new htmldb_Get(null,$x('pFlowId').value,'APPLICATION_PROCESS=popDevices',0);
get.add('P153_MODEL',PART_NO);
gReturn = get.get();
get = null;
3. I've included the following in the "Element Attributes" field of the Date-Picker Item (Date_Delivered).
The Region Type is "SQL Query (Updatable Report)"
onChange="javascript:popDevices(PART_NO);"
THE RESULTS
A. A row does get inserted into the other (P_Devices) table,
But the value of the Attribute from the Page Region is not valid.
The Inserted value is this: [object HTMLTableCellElement]
B. I have tried Every conceivable combination of characters in the "Element Attributes" field, such as:
...(PART_NO), (#PART_NO#), (||PART_NO||), (+PART_NO+)
C. The Javascript in the Page HTML Header appears to be correct, since I have written it this same way for other applications without any problems.
D. If this simply cannot be done by referencing the "onChange" Javascript from the "Element Attributes" field,
Then can you help me to write the code into the Select statement of the region.
Thanks for any help you can give me.
-Gary

This may not be the most direct approach to the solution. But, none the less, it is a solution.
For those other novices, like myself, I hope this can be useful at some point in your development:
MY DESIRED RESULT:
A. To Insert into another tablle values derived from both; Page Item (i.e. P153_x) and Attributes of a Row in an Updatable Report from which I have selected the Date-Picker.
B. I want the insert to occur automatically after the user Selects the date from the Date-Picker.
SOLUTIONS:
1. I usea Javascript prompt window to prompt for information and store the information in Pre-Created Page Items.
This is the Javascript as I've entered it into the Page HTML Header region: (Minus the Tags)
function received_javaprompt () {
var Serial_Number = prompt("Enter the Serial Number");
var Bldg_Id = prompt("Enter the Bldg_Id");
var Clst_Id = prompt("Enter the Clst_Id");
$x('P153_SERIAL_NO').value = Serial_Number;
$x('P153_BLDG_ID').value = Bldg_Id;
$x('P153_CLST_ID').value = Clst_Id;
2. I needed to identify the (Manufacturer and Part_No) Column Attribute in the Row from which I selected the Date-Picker.
A. To do this, I enumerated the Columns in the order they were listed in the Select Statement of the region (Click on the Region Definition Tab).
B. Then (Click on the Report Attributes Tab). Count, In the numerical order which these columns are selected, ONLY the columns that are Editable.
C. When I counted down as far as the Column I wanted to capture the value of, Then I made a mental note of that number and used it in the following (2) Javascripts (findMaker and findModel).
3. findMaker (Minus the tags)
function findMaker (pThis) {
var vRow = pThis.id.substr(pThis.id.indexOf('_')+1);
var Maker = html_GetElement('f15_'+vRow).value
$x('P153_MAKER').value = Maker;
4. findModel (Minus the tags)
function findModel (pThis) {
var vRow = pThis.id.substr(pThis.id.indexOf('_')+1);
var Model = html_GetElement('f16_'+vRow).value
$x('P153_MODEL').value = Model;
5. I added one more Javascript, to the Page HTML Header, that references the Application Process which will Insert the values into the "Other" table:
function popDevices(P153_SERIAL_NO,P153_BLDG_ID,P153_CLST_ID,P153_MAKER,P153_MODEL)
var get = new htmldb_Get(null,$x('pFlowId').value,'APPLICATION_PROCESS=popDevices',0);
get.add('P153_SERIAL_NO',P153_SERIAL_NO);
get.add('P153_BLDG_ID',P153_BLDG_ID);
get.add('P153_CLST_ID',P153_CLST_ID);
get.add('P153_MAKER',P153_MAKER);
get.add('P153_MODEL',P153_MODEL);
gReturn = get.get();
get = null;
6. I added the "onChange" process to the Element Attributes field of the Table item which utilizes the Date-Picker:
A. Click on the Report Attributes Tab of the Region.
B. Click on the Edit icon of the column which utilized the Date-Picker
C. I added this "onChange" reference to the Element Attributes field, which is found in the Tabular Form section.
onChange="javascript:received_javaprompt();findModel(this);findMaker(this);popDevices((P153_SERIAL_NO).value,(P153_BLDG_ID).value,(P153_CLST_ID).value,(P153_MAKER).value,(P153_MODEL).value);"
7. The Application Process which inserts the collected data into the table is as follows:
(Name= popDevices: Process Point= On-Demand: Type= PL/SQL Anonymous Block)
BEGIN
Insert into P_DEVICES
BLDG_ID,
CLST_ID,
NAME,
IP_ADDRESS,
SERIAL_NO,
MAKER,
MODEL
) values
:P153_BLDG_ID,
:P153_CLST_ID,
'Unassigned',
'Unassigned',
:P153_SERIAL_NO,
:P153_MAKER,
:P153_MODEL
COMMIT;
END;
Well, I hope this may help someone else like me.
I usually arrive at my solutions by getting help here on the Discussion Forum and also Google. Google inevitably points me to a previous Apex Discussion Forum session.
Edited by: garyNboston on Mar 15, 2010 10:55 AM

Dynamic Action On Date Picker

Hi,
I need help with understanding dynamic actions. I have two date pickers, I want the value of the first date picker to be the minimum date of the second date picker. To achieve this I have a hidden item whose value I want to reflect the selected date in the required format. In the dynamic action on the date picker I have no condition, and the true action is set to execute the following pl/sql code
:P200220000_Y_MIN_DT := TO_CHAR(TO_DATE(:P200220000_Y_STR, 'DD-MON-YYYY'), 'YYYYMMDDHH24MI');. The items to submit field contains both the first date picker and the hidden item.
The "P200220000_Y_MIN_DT" is now passed into the minimum date field of the second date picker. The problem is when the date is changed the hidden item does not get the value until the page is refreshed.
Am I doing something wrong or just have not mastered the use of dynamic action or are my colleagues right use AJX call backs not dynamic actions.
Thanks
Aderemi

Hi Aderemi,
first of all as already explained, the min/max values are already used on the server side when the necessary code for the date picker is rendered. When you changed the referenced values in the browser, these values will not change the behavior of the client side date picker widget. But when you submit the page, the new min/max values will be used by the date picker validation check on the server.
To over the client side date picker display issue, you could directly call the date picker JavaScript code and pass in the new min/max values. Have a look at http://jqueryui.com/demos/datepicker/
So for example you could have a dynamic action of type "Execute JavaScript code" which executes the following Javascript code.
apex.jQuery('#P200220000_MY_DATE_PICKER').datepicker("option", "minDate", "-1m");I think that should work. Note: I haven't tested if that really works and it's also some kind of unsupported, because it uses the underlaying jQueryUI APIs the APEX date picker is using. This could change in the future and would invalidate your code.
Regards
Patrick
My Blog: http://www.inside-oracle-apex.com
APEX 4.0 Plug-Ins: http://apex.oracle.com/plugins

Default value of date picker not showing in sql query

Hi,
I have a tabular form page with a query similar to the following:
select emp_name, salary from emp_table where trunc(hire_date)=trunc(to_date(:P42_START_DATE))
where P42_START_DATE is the name of a date picker item.
I set the source type of the date picker to be "Only when current value in session state is null" and the value to be "select trunc(next_day(sysdate,'MON')-7) from dual;" - basically the monday of the current week. I set the sequence of the date picker to be 5, and the sequence of the region to be 10. Now, when I open this page, no data gets pulled. I checked the page source, and the value of the date picker input is being set to "17-NOV-2008", but it somehow isn't reflected in the sql query.
Data does get retrieved if I manually set the date in the date picker, but I'd like it to default to the monday of the current week. What am I doing wrong?
Thanks

nope, still same problem.
I used javascript alerts to help debug, and here might be some useful information.
The computation to set the value of :P42_START_DATE is set to run "before header", but when I put this following javascript in the header:
<script language="javascript">
var c = $v('P42_START_DATE');
alert(c);
</script>
the alert box is blank (ie :P42_START_DATE is empty). Putting the same exact script in the footer gives 24-Nov-2008 in the alert box. Now, the SQL query is run sometime after the first alert and before the second alert, I believe. Why would the value of :P42_START_DATE not be getting set at the correct time?
P42_START_DATE is a date picker item that belongs to the region SCHEDULE (which is where the sql query is). I set the sequence of the region to 10, and the sequence of the date picker and computation to be 5 and 6. Even so, does this mean that the sql query is executing before the call to the computation, because the region needs to be created before any items can be created that belong to the region?

"Date picker" in report - - View source shows no label for the date picker

Hi
In one of my reports, I am using multiple types (textarea/text/date picker/select list)
I wanted to use a javascript based on the label, but I do not see "<label>" for Date picker in the view source due to which my Javascript fails.
Snippet of view Source:
<td class="t3data" ><label for="f08_0001" class="hideMe508">CATEGORY</label><textarea name="f08" rows="4" cols="16" wrap="VIRTUAL" id="f08_0001">EMPLOYEE INDUCTION</textarea></td>
<td class="t3data" ><span class="lov"><input type="text" name="f11" size="15" maxlength="2000" value="29-FEB-08" style="padding-right:5px;" id="f11_0001" /><script type="text/javascript">
As you can see above, we have a "label for" for the text area but not for the date picker
Is there a reason for the same?
Thanks
Nitin

Hi,
OK - the headers attribute should also help as these will identify the correct cells. You would need to know the html tags used within each cell for each datatype.
Would using cloneNode help you? It's a method of creating a copy of an entire row in a single instruction
Andy

JSF/ Javascript Date Picker

Similar Messages

Maybe you are looking for