Validation on datepicker

Hello expert
i want to create validation on datepicker when we select the date.is it possible ?
please help me for that
Thanks & Regards
Vilas maskey

Hello
You can use the event et_PICKER_CLICKED. The After event occurs after the user makes a selection or chooses Cancel.
Regards
János

Similar Messages

Validations for DatePicker control in SAP UI5

Hi,
I am using DatePicker control from sap.ui.commons library. I want to add validations to this date. What can be the best possible way to have validations apart from implementing change method ?
Is it possible for the framework to popup the error message in the red color as we get to see in some standard form?
Any help will be appreciated.
Thanks,
Supriya Kale

That's the beauty of the formatter and the use of a model:
var oDP = new sap.ui.commons.DatePicker({
    valueState :{
        parts     : ["/myDate", "/notBeforeDate"], //bound to both 'myDate' and 'notBeforeDate' property in your model
        formatter : function(oDateValue, oNotBeforeDateValue) {
            return (oDateValue < oNotBeforeDateValue) ? sap.ui.core.ValueState.Error : sap.ui.core.ValueState.None;
See Custom Formatter Functions - User Interface Add-On for SAP NetWeaver - SAP Library for more info

Spry Validation and ADDT DatePicker Widget

I have a number of text fields which I applied Spry
Validation to and set them to "required". These function correctly
until I add a ADDT DatePicker widget to the form. Now the
validation doesn't work.

Hi Gabriele,
technically speaking, ADDT and the Spry framework have about nothing in common, and you´re going to stumble across many compatibility-related issues when trying to use them together.
Does anyone have a solution??
any regular user who´d like to provide a solution to this, would have to be a pretty skilled programmer and would have to know the "technical details" of both ADDT and SPRY very well to be of help -- I don´t think that you´ll find many folks here who are capable to do that.
However, why not making the date field required in ADDT ?
Cheers,
Günter Schenk
Adobe Community Expert, Dreamweaver

UI Datepicker and Spry textfield Validation

Hi, I am having a problem with using the UI Date picker and Spry textfield Validation together. I have created a sample form: 2 input boxe, the test box has the datepicker and spry validation and test2 has the date picker only,one submit button and some php code that echos the boxes values on submit.
My date picker is date formated as 'yy-mm-dd' for four digit year. My spry validation is formated 'yyyy-mm-dd' with validate on submit.
Now when I click on the test input box the datepicker comes up normally and i select a date. I then select the date on test2. Once I click the submit button the test field with spry validation come back saying a value is required and nothing else happens.
I was playing around and trying other things to get it to work and I noticed that when I select the test inputbox and the calander pops up if I enter some numbers into the text box then select a date from the datepicker then enter a date in the test2 inputbox and hit submit it works.
So it appears to me that the validation is not reading anything in the test field when I just select a date. Why is that? When I select a date it shows a date in the inputbox. It makes it hard to use the datepicker on a form.
Any help would be a preciated. Code is below.
Thanks Winrol
<?php echo "Test box 1 value = ". $_POST['test']. "<br/>" ?>
<?php echo "Test box 2 value = ". $_POST['test2'] ?>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script src="jquery-ui-1.7.2/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="jquery-ui-1.7.2/js/jquery-ui-1.7.2.min.js" type="text/javascript"></script>
<script src="SpryAssets/SpryValidationTextField.js" type="text/javascript"></script>
<link href="jquery-ui-1.7.2/css/base/ui.core.css" rel="stylesheet" type="text/css" />
<link href="jquery-ui-1.7.2/css/base/ui.datepicker.css" rel="stylesheet" type="text/css" />
<link href="jquery-ui-1.7.2/css/base/ui.theme.css" rel="stylesheet" type="text/css" />
<link href="jquery-ui-1.7.2/css/base/ui.datepicker.images.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* BeginOAWidget_Instance_2137022: #datepicker */
#datepicker .ui-widget {
font-family: inherit;
#datepicker .ui-datepicker {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
#datepicker .ui-datepicker-title {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 1.1em;
color: #000;
font-weight: normal;
line-height: 1.8em;
#datepicker .ui-state-default, .ui-widget-content .ui-state-default {
border-color: #e6e6e6;
background-color: #e6e6e6;
color: #555555;
#datepicker .ui-state-default, .ui-state-default a {
color: #555555;
#datepicker .ui-state-highlight, .ui-widget-content .ui-state-highlight {
border-color:#FCEFA1;
background-color:#FCEFA1;
color:#363636;
#datepicker .ui-state-active, .ui-widget-content .ui-state-active {
border-color: #FFFFFF;
background-color: #FFFFFF;
color: #212121;
#datepicker .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus
border-color: #5F5F5F;
background-color: #5F5F5F;
color: #212121;
#datepicker .ui-widget-header
border-color: #5F5F5F;
background-color: #808080;
border-width: 1px;
/* Text attributes for the Days of Week Text */
#datepicker .ui-datepicker table th
font-size: .8em;
color: #000;
font-weight: bold;
/* EndOAWidget_Instance_2137022 */
</style>
<script type="text/xml">

</script>
<script type="text/javascript">
// BeginOAWidget_Instance_2137022: #datepicker
$(function() {
$('input').filter('.datepicker').datepicker({dateFormat: 'yy-mm-dd'});
// EndOAWidget_Instance_2137022
</script>
<link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
background-color: #FFC;
</style>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<p>
    <label for="test">test</label>
    <span id="sprytextfield1">
    <input name="test" type="text" class="datepicker" id="test"/>
    <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span></p>
<p>
    <label for="test2">test2</label>
    <input name="test2" type="text" id="test2" class="datepicker" />
</p>
<p onclick="<?php echo $_POST['test'] ?>">
    <input type="submit" name="submit" id="submit" value="Submit" />
</p>
</form>
<script type="text/javascript">
var sprytextfield1 = new Spry.Widget.ValidationTextField("sprytextfield1", "date", {format:"yyyy-mm-dd", hint:"yyyy-mm-dd"});
</script>
</body>
</html>

This does work
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet">
<link href="jquery-ui-1.7.2/css/base/ui.core.css" rel="stylesheet">
<link href="jquery-ui-1.7.2/css/base/ui.datepicker.css" rel="stylesheet">
<link href="jquery-ui-1.7.2/css/base/ui.theme.css" rel="stylesheet">
<link href="jquery-ui-1.7.2/css/base/ui.datepicker.images.css" rel="stylesheet">
</head>
<body>
<form action="" method="post">
<span id="sprytextfield1">
<label for="mydate">Date:</label>
<input id="datepicker" name="mydate" type="text">
<span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span>
<div id="datepicker" class="ui-glass-gradient ui-80TopTo0Bottom-gradient-header"></div>
<input name="mysubmit" type="submit">
</form>
<script src="SpryAssets/SpryValidationTextField.js"></script>
<script src="jquery-ui-1.7.2/js/jquery-1.3.2.min.js"></script>
<script src="jquery-ui-1.7.2/js/jquery-ui-1.7.2.min.js"></script>
<script>
var sprytextfield1 = new Spry.Widget.ValidationTextField("sprytextfield1", "date", {format:"mm/dd/yyyy", validateOn:["change"], useCharacterMasking:true});
$(function() {
    $('#datepicker').datepicker({ showOtherMonths: false });
</script>
</body>
</html>
Gramps

ADDT Datepicker and spry validation don't work together

Datepicker and spry validation don't work together
the problem is in: /includes/wdg/classes/MXWidgets.js
(necessary to datepicker)
Does anyone have a solution??
Thanks

Hi Gabriele,
technically speaking, ADDT and the Spry framework have about nothing in common, and you´re going to stumble across many compatibility-related issues when trying to use them together.
Does anyone have a solution??
any regular user who´d like to provide a solution to this, would have to be a pretty skilled programmer and would have to know the "technical details" of both ADDT and SPRY very well to be of help -- I don´t think that you´ll find many folks here who are capable to do that.
However, why not making the date field required in ADDT ?
Cheers,
Günter Schenk
Adobe Community Expert, Dreamweaver

Using a datepicker with format mask MM/YYYY gives error on submit

I'm trying to use a datepicker with the format MM/YYYY.
The item is linked to a database column of type DATE.
The items displays correctly (month and year), but when submitting the page, I get an "ORA-01843: not a valid month" error from the built-in DML process.
Shouldn't Apex apply the same date format mask to the item value when trying to save it to the database?
- Morten
http://ora-00001.blogspot.com

Hi Mike,
I can/need to do that for my own PL/SQL processes, but the problem is with the Built-In DML Process....
- Morten
http://ora-00001.blogspot.com

Help with Conditional Display and Validation

Version 4.1.1.00.23
Hello,
I'm having a difficult time with a conditional display and validation I'm hoping someone can help with.
Requirements:
When the Start Date (Datepicker) and/or End Date (Datepicker) change then display the Change Reason (Select List) and Change Description (Textbox)
If the page is saved without entering a Change Reason display a validation error message that the Change Reason cannot be empty (NULL)
What I've tried
Create a Dynamic Action on the Start Date
Event: Change
Selection Type:Item(s)
Items(s): P51_START_DATE
Condition: none
True Action Section:
Action: Show
Fire on Page Load: Checked
Show all page items on the same line: No
Affected Items Section:
Selection Type:Item(s)
Item(s): P51_CHANGE_REASON,P51_CHANGE_DESC
I've also created a Dynamic Action with similar settings for the P51_END_DATE.
I created a Validation for the P51_CHANGE_REASON as Function Returning Error Text:
DECLARE
    v_start_date    work_items.start_date%TYPE;
    v_end_date      work_items.end_date%TYPE;
BEGIN
    SELECT start_date
          ,end_date
    INTO   v_start_date
          ,v_end_date
    FROM   work_items
    WHERE work_items_id = :P51_WORK_ITEMS_ID;
    IF ( (v_start_date != TO_DATE(:P51_START_DATE,'DD-MON-YYYY') OR v_end_date != TO_DATE(:P51_END_DATE,'DD-MON-YYYY') ) AND
          :P51_CHANGE_REASON IS NULL ) THEN
        RETURN 'Change Reason must have a value';
    END IF;
END;
The Issue
I tried to create another Dynamic Action to hide the P51_CHANGE_REASON and P51_CHANGE_DESC fields on page load, but when either of the date fields are changed and the validation is fired the P51_CHANGE_REASON and P51_CHANGE_DESC are hidden again.
There are two buttons to submit the page: 'SAVE' will submit the page and stay on the page and 'SAVE_CHANGES' will submit the page and branch to the previous page (which is a report with EDIT buttons to edit the record).
I can't get the page load Dynamic Action to NOT fire when the validation is fired.
I hope this is clear and if not what information can I provide?
Thanks,
Joe

Phil,
Thank you for looking at this.
Yes if the Change Reason is NULL when the edit page is displayed then the Change Reason and Change Description fields are hidden. If the Start Date (Datepicker) and/or End Date (Datepicker) change then display the Change Reason (Select List) and Change Description (Textbox). If the page is saved without entering a Change Reason display a validation error message that the Change Reason cannot be empty (NULL).
The problem I'm having is that if no Change Reason is entered and the page is saved thereby firing the validation the Change Reason and Change Description fields are hidden again (because of the On-Load Dynamic Action to hide them). So now the user can't put in a Change Reason...unless they change one of the date fields again which isn't going to be accepted.
Is there a way to determine if a validation error was fired and be able to use that on the On-Load Dynamic Action to hide the two fields? Something like...If the validation fired then don't run?
Please let me know if I'm still confusing you.
Thanks,
Joe

Setting validation based on condition on custom list

Hi,
I have a custom Image library. I have two custom columns created as part of metadata.
One is a dropdown choice column, which contains 2 values - "Free", "Paid".
I also have a datepicker column (date only).
I would like to set a validation based on below condition:
If dropdown selected is "Paid", then date should be mandatory field.
Can this be achieved OOB or a JSLink is required.
How to achieve this?
Thanks

Hi Vankatzeus,
You can achieve this using Javascript. In New and edit forms of your list, add a content editor webpart with the script explained below -
There is a PreSaveAction() function that you can use to do a custom validation. Before submitting any item, sharepoint first do the validation in PreSaveAction().
function PreSaveAction() {
//Step 1 - Read the choice and date fields.
// Step 2 - If choice is 'PAID' and 'date' field is blank { alert('Date can't be blank'); return false;} else {return true;}
In Step 1, write a script that read values from choice and date fields. You can take the script from
here and modify it just to read choice and date fields.
Cheers,
Manvir

Date popup validation in manual tabular form

Hey all-
I'm creating a tabular form manually (i.e., with apex_collection) per instructions at OBE (http://www.oracle.com/technology/products/database/application_express/ppt/odtug2008_marcie_young.pdf). Working fine, except I'm having a problem with apex_item.date_popup.
One of the fields I need to collect from the tabular form is a date. For the SQL report, the relevant item is apex_item.date_popup(9, null, c008, 'YYYY-MM-DD', 20, 10) (and c008 is the relevant column from the collection). The trouble comes in if a user types a bogus date into the date popup. I have validation code to check this, but before running that code, I have to store the user's new entries into the collection. So basically my steps are:
1. display the tabular form w/ a SQL report containing apex_item.date_popup
2. use an update collection PL/SQL process to store the user data into the collection (process point = On Submit and Before Computation)
3. use a validation PL/SQL process to verify the data in the collection before processing the update
All that works, and the validation identifies the bad date. But then the page tries to render the tabular form again (so the user can fix the bad date), but the apex_item.date_popup(9, null, c008, 'YYYY-MM-DD', 20, 10) column fails b/c of the bad date. I need a way to programmatically create a date popup and populate it with (potentially) invalid data. Any ideas?
Thanks
Rob

Problem solved. Tossed the lackluster apex_item.date_popup and replaced w/ jQuery datepicker.
Rob

Jquery Date Picker Validation - format issue

Hi ,
I am using 2 text items with Jquery dateicker for start date and end date items.
I have to now write a JS validation to ensure start date <= end date.
The dateformat of my items are 'd-M-yy' (02-Mar-2010) .....
When I try to use the Date.parse() function , it gives me an invalid date error....
If I change the date format to mm/dd/yy (03/02/2010) then there is no problem, I can use Date.parse() and compare the two dates, I get no error . However I need the date format to be : 02-Mar-2010
Below is a simple version of the JS function Iam using to compare dates and alert error
function f_validate()
var a = $v('P1_START_DATE');
var b = $v('P1_END_DATE');
var startDate = new Date();
var endDate = new Date();
startDate = Date.parse(a);
endDate = Date.parse(b);
// if I alert() startDate or endDate it says invalid date
if (startDate>endDate){
alert('error');
else
doSubmit();
} Has anybody done a similar validation with Jquery datepickers in the format 'd-M-yy' ?
Also how Can I use $.datepicker.parseDate function within my Javascript function so that I can convert the dates to the default format and then compare them....
Appreciate any ideas/pointers
Thanks,
Dippy
Edited by: Dippy on Mar 2, 2010 12:42 AM

I've used the following without problems:
   var gasDay = $v('P0_GAS_DAY');
   var gasDayDate = new Date();
   gasDayDate = $.datepicker.parseDate('dd-M-yy', gasDay,
      monthNamesShort : ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC']
   );

How to restirct datepicker in OAF

dear friedns?
how to restict datepicker validation in OAF?
Thanks
krish
Edited by: user5425941 on May 19, 2011 3:26 AM

Hi,
Attach an event with the Date Picker Bean. And handle this event in the PFR of the CO.
String eventName = pageContext.getParameter(EVENT_PARAM) ;
if (eventName.equals("SearchByEventUpdate"))
//Get the value from the Date Picker...
//Now put the validation logic Accordingly over here....
}Hope u know how to attach a event with a Bean. If no, then let me know.
Regards,
Gyan

[CF10] CFINPUT custom validation start and end dates

Hello, everyone,
Another developer that I am working with is working with a form that has start and end dates. He'd like to be able to use custom JavaScript validation to make sure that not only are the dates in proper format (that part of the JS is working fine), but that it will also check to make sure that the start date will always be prior to (or equal to) the end date, and will throw an alert if the end date is before the start date.
I've Googled for this, and am finding informative suggestions on just making sure the date is in the right format, or falls within a certain range, but nothing on how to make sure that one date is before (or less than) another.
I'm guessing that data binding might be a part of it. Can anyone suggest how to set these fields so that each has a validateat="onblur" that will check both values?
Also, as a related issue, he has the CF datepicker working as far as entering the dates, but since the field doesn't get/lose focus on this, how do we trigger the function?
V/r,
^_^

i had tried this a few times but I kept getting an invalid numer to character error. Maybe my syntax was off. Let me try again.
I must have had syntax errors. I tried it again, the way you typed it out and it worked. Before I was using '/' instead of '-' to separate the date fields.
Thanks again!!

Interactive Report datepicker error

Apex 4.1.1.00.23
I recently started using jQuery 1.8.3 and jQueryUI 1.9.1 and a user noticed that when clicking on a date in the datepicker of an Interactive Report they get a javascript error:
Line 7316 character 3
Error: 'undefined' is null or not an object
appears to be the following line:
var inst = this._getInst(target[0]); is leaving inst undefined...
I'm sure it is where I'm including the UI or something because I can't reproduce the problem on http://apex.oracle.com...
I've found a way to replace the clicking on the calendar icon to use all the latest versions of jQuery and the UI and it works, but I think I should really try to fix it a different way (incase there is somewhere else I haven't found yet)...
Any ideas?

Hi,
there are more validations than you think. Anthony Rayner has prepared a nice summary in a [url http://anthonyrayner.blogspot.com/2010/08/apex-40-enhancements-validating-form.html]blog post.
You see in that post where and how to disable validations, but also, that you may not disable all of them. The only way to avoid all validations would be to implement the report yourself completely.
The good news is, you can overwrite those messages. The following documentation tells you how to:
http://download.oracle.com/docs/cd/E17556_01/doc/user.40/e15517/global.htm#CHDEDHBJ
-Udo

Locking down a datepicker

I am having a problem with end users entering improper data into a datepicker field. Is there a way I can lock it down so the end user must use the calendar button to select the date and the text entry part of the field is disabled?
David Pulliam

lol Then your DBA would have to reject any code from your developers, because that could also cause stability issues... :-)
ApexLib is just regular PL/SQL code and doesn't do any dirty things or modifies your APEX installation in anyway. It uses regular APEX hooks to do its work. Just install it into your application schema (you can probably do that too) and you are done. You don't have to install it into an extra schema.
About your validation. You don't have to do Regex. Just use the validation type I told you. That will validate your date value against the format mask you have specified in your page item.
Patrick
My APEX Blog: http://inside-apex.blogspot.com
The ApexLib Framework: http://apexlib.sourceforge.net
The APEX Builder Plugin: http://sourceforge.net/projects/apexplugin/

Disable Datepicker Input

Hi All,
I would like to disable the datepicker input field so that the user has to choose the date from the calendar.
Does anyone know how to do this?
I seem to recall that you can somehow use Javascript to disable the field, but I dont know where/how to implement it?
Here is my datepicker field
        <Field name=':variables.startDate'>
          <Display class='DatePicker' action='true'>
            <Property name='title' value='Start Date:'/>
            <Property name='required' value='true'/>
            <Property name='strict' value='true'/>
            <Property name='SelectAfter'>
                <rule name='BHCS-EndUserRuleLibrary:BHCS-GetTodaysDate'/>
            </Property>
            <Property name='help' value='Start Date of the contractor.'/>
          </Display>
          <Validation>
              <cond>
                  <isnull>
                      <ref>:variables.startDate</ref>
                  </isnull>
                  <s>! You must supply a valid value for Start Date in format MM/DD/YYYY !</s>
              </cond>
          </Validation>
        </Field>Any help would be greatly appreciated, this simple task is driving me nuts...
Larry V.

Here is how we accomplished this:
1. Modified the standard.js file to:
a. include a new method which uses javascript to mark the field elements as read-only
function disableDateFields()
// disable Expected start Date fields
var expS1 = document.getElementById("variables.expectedStartDateDay");
if (typeof expS1 != "undefined" && expS1 != null)
expS1.readOnly=true;
else
expS1 = document.getElementById("variables.global.expectedStartDateDay");
if (typeof expS1 != "undefined" && expS1 != null)
expS1.readOnly=true;
var expS2 = document.getElementById("variables.expectedStartDateYear");
if (typeof expS2 != "undefined" && expS2 != null)
expS2.readOnly=true;
else
expS2 = document.getElementById("variables.global.expectedStartDateYear");
if (typeof expS2 != "undefined" && expS2 != null)
expS2.readOnly=true;
var expS3 = document.getElementById("variables.expectedStartDateMonth");
if (typeof expS3 != "undefined" && expS3 != null)
expS3.readOnly=true;
else
expS3 = document.getElementById("variables.global.expectedStartDateMonth");
if (typeof expS3 != "undefined" && expS3 != null)
expS3.readOnly=true;
b. ADDED the following line bolddisableDateFields();*bold* to the end of the function
function selectFirstEditField() {...}
This function is called when the body of each edit page has opened.

Validation on datepicker

Similar Messages

Maybe you are looking for