Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Apex datepicker disable

Posted on 2012-04-11
12
Medium Priority
?
3,492 Views
Last Modified: 2012-05-14
Hi,

How do I disable date picker item (specifically the date picker pop up).
When I use 'Read Only' option of the item, the format of the date picker becomes absurd. So I need a way to disable/ readonly the date picker.

I am workingon apex Version 4.0

Thanks.
0
Comment
Question by:vsarma50
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 6
12 Comments
 
LVL 20

Expert Comment

by:gatorvip
ID: 37837360
What's the point of disabling a date picker? If you just want to display a date, use a label or text field (with read-only set to Always)
0
 

Author Comment

by:vsarma50
ID: 37837398
No my requirement is as follows.


I am having a tabular form. I made 2 columns as read only. But when we

add a new row by clicking the Add Row button these columns will be editable for that particular row.

After adding the data and press the submit button that 2 columns will be changed to read only. but one of the column is date column which iam able to make it read only but the icon datepicker is allowing to modify the date,so i want to disable and enable conditionlly as mentioned above. when i click add row the text box is getting editable and should the same with date picker.
0
 
LVL 20

Expert Comment

by:gatorvip
ID: 37837438
I set up a test with a date picker in a tabular form - I can't replicate your error where "the format of the date picker becomes absurd" when disabling the date picker (I used the same JavaScript that I previously posted in one of your threads).

Make sure you specify a date format under Column Attributes / Number/Date Format. If you still get an error, please post a screen shot.
0
Get your Conversational Ransomware Defense e‑book

This e-book gives you an insight into the ransomware threat and reviews the fundamentals of top-notch ransomware preparedness and recovery. To help you protect yourself and your organization. The initial infection may be inevitable, so the best protection is to be fully prepared.

 

Author Comment

by:vsarma50
ID: 37837459
can you please give me the code snippet you used to disable the datepicker. iam trying to disable the datepicker with the same logic you provided but i could not.
thanks.
0
 
LVL 20

Expert Comment

by:gatorvip
ID: 37837466
In this instance, "f11" is the array used for the date picker.

<script type="text/javascript">
var f2=document.getElementsByName("f11");
for (var r = 0; r < f2.length; r++)
{
   if(f2[r].value != "")
   {
      f2[r].disabled=true;
   }
}

</script>

Open in new window


If you get any errors, make sure you post them here.
0
 

Author Comment

by:vsarma50
ID: 37837516
Hi, The below is the code I used i made the textbox as read only and the datepicker icon to be disabled but still able to see the popup when clicked on the datepicker icon. please find the atteched document with screen shots.

<script type="text/javascript">

var f1=document.getElementsByName("f04");
var f2=document.getElementsByName("f05");
var f3=document.getElementsByName("#f05_0000");

for (var r = 0; r < f1.length; r++)
{
   if(f1[r].value != "")
   {
      f1[r].readOnly=true;
      f2[r].readOnly=true;
      f3[r].disabled=true;

   }
}

</script>
Doc4.doc
0
 
LVL 20

Expert Comment

by:gatorvip
ID: 37839252
it looks like the image itself needs to be disabled in a different way, but also in JavaScript

http://roelhartman.blogspot.in/2009/03/how-to-disable-calendar-button.html

example here:
http://apex.oracle.com/pls/otn/f?p=41715:16

If you can't figure it out, I might be able to give you an example later today.
0
 

Author Comment

by:vsarma50
ID: 37851831
Hi
thanks for the response.
But iam still not able to disable the datepicker

with the below code how can I incorporate the http://apex.oracle.com/pls/otn/f?p=41715:16
I tried but not working.
here f5 is the date picker in table form.

<script type="text/javascript">

var f1=document.getElementsByName("f04");
var f2=document.getElementsByName("f05");

for (var r = 0; r < f1.length; r++)
{
   if(f1[r].value != "")
   {
      f1[r].readOnly=true;
      f2[r].readOnly=true;

     }
}


 


</script>
0
 
LVL 20

Expert Comment

by:gatorvip
ID: 37858271
Sorry, been swamped with some projects.  Are you saying that the code above
a) doesn't disable the text field part of the datepicker
or
b) doesn't disable the image part of the datepicker?

Normally a) shouldn't happen, meaning that at the very least the text field should be disabled. The JavaScript code in the links from my previous post should disable the image too.
0
 

Author Comment

by:vsarma50
ID: 37860411
Hi,

Thanks very much for the response.
In the code given by you i didn't made the text box(datepicker) disable but made it as readonly because if I disable then I am getting error when trying to update other fields.
however, I am ok with readonly property of the two textboxes. But only problem how to disable the datapicker image which should be in  after the two lines. thanks once again.

      f1[r].readOnly=true;
      f2[r].readOnly=true;
0
 
LVL 20

Accepted Solution

by:
gatorvip earned 2000 total points
ID: 37872167
OK, I figured out how to disable the image as well. You can delete the previous code as that only disabled the field.

1. Edit your date picker field in the tabular form and go to the Column Attributes page for the item
2. In the Element  Attributes field, enter the following
class="DatePickerClass"

Open in new window

 (you can choose a different name, just make sure you remember what it is). Save changes.
3. Create a new Dynamic Action - you might want to do dummy entries and then edit the Dynamic Action with the following entries:
Event: Change
Selection Type: jQuery Selector
jQuery Selector: .DatePickerClass (make sure to include the ".")
Condition: No Condition

Add True Action:
Action: Execute JavaScript Code
Fire When Event Result Is: True
Fire On Page Load: yes (checked)

Event Scope: bind

Code
fieldID = 'f11_' + $(this.triggeringElement ).attr('id').substr(4);
if ($(this.triggeringElement ).val() != "") 
{ 
  $("#" + fieldID).datepicker("disable"); 
}

Open in new window

(here you can replace f11 with whatever element corresponds to your date picker)

Apply Changes and Save and your date picker should be disabled.

For future reference, you might want to add JavaScript and/or JQuery to your Topic Areas.
0
 

Author Closing Comment

by:vsarma50
ID: 37965432
thanks very much.
0

Featured Post

NFR key for Veeam Agent for Linux

Veeam is happy to provide a free NFR license for one year.  It allows for the non‑production use and valid for five workstations and two servers. Veeam Agent for Linux is a simple backup tool for your Linux installations, both on‑premises and in the public cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Truncate is a DDL Command where as Delete is a DML Command. Both will delete data from table, but what is the difference between these below statements truncate table <table_name> ?? delete from <table_name> ?? The first command cannot be …
Shell script to create broker configuration file using current broker Configuration, solely for purpose of backup on Linux. Script may need to be modified depending on OS-installation. Please deploy and verify the script in a test environment.
This video shows setup options and the basic steps and syntax for duplicating (cloning) a database from one instance to another. Examples are given for duplicating to the same machine and to different machines
This video shows how to copy an entire tablespace from one database to another database using Transportable Tablespace functionality.

609 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question