Loading...

Search jQuery

Search

jQuery Forum

Using jQuery UI

No clear option in datePicker

in Using jQuery UI • 4 years ago

I have a really simple date picker example. I've tried this with
jquery's latest and with the 1.3 and I'm using UI 1.6.
I just created the UI code on monday so its fresh.
The date pickers pop up just fine but there isn't a 'close' or 'clear'
text like in the demo.
    $('#date1').datepicker();
    $('#date2').datepicker({beforeShow: function(){
                    return{ minDate: $('#date1').datepicker("getDate")};
                    },
                changeYear:true,
                yearRange: '-10:+20',
                closeAtTop:true,
                clearText:'Clear'
                });
I realize that the closeAtTop isn't neccessary as it's supposed to
default to 'true' but it didn't work without it so I thought I would
put it in but to no avail.
Any help would be appreciated.

1

Replies(18)

rdworth

Re: No clear option in datePicker

4 years ago

Do you mean this demo?
<a href="http://ui.jquery.com/demos/datepicker#buttonbar">http://ui.jquery.com/demos/datepicker#buttonbar</a>
This is accomplished by
$('#datepicker').datepicker({
showButtonPanel: true
});
- Richard

Re: No clear option in datePicker

4 years ago

No, actually I was referring to the example in the Docs...
http://docs.jquery.com/UI/Datepicker
I'm guessing this one uses 1.5 and not the 1.6rc4?
Is this deprecated in 1.6?
Is the clear option no longer available?
Bryce

rdworth

Re: No clear option in datePicker

4 years ago

The documentation is not yet updated for 1.6, since 1.6 is still in release candidate. We always maintain documentation for the latest stable release (currently 1.5.3). Over the next week as we approach 1.6 final, we'll be updating all of the documentation. As far as what has changed between 1.5.3 and 1.6rc5, see
<a href="http://jqueryui.pbwiki.com/DatePickerCalendar">http://jqueryui.pbwiki.com/DatePickerCalendar</a>
under Section 3, subsection 'Changes from 1.5, 1.6rc2 in refactor'
- Richard

Re: No clear option in datePicker

4 years ago

That kind of stinks about the clear function being taken out. I
really like the design visually of the 1.6 version over the 1.5
version. I'm working with someone who only wants to allow the user to
pick a date from the datepicker and not allow them to wipe it out once
it has been chosen, simply allow them to clear it. He is trying to
limit them from being able to edit the date manually after it has been
entered. He wants to take away access to the backspace key that way
they can't delete part of the date except they can delete the entire
date. Its really a validation issue.
Any suggestions other than using 1.5?
Bryce

dmfontz

Re: No clear option in datePicker

4 years ago

You might be able to set the input to readonly... readonly="readonly"

Re: No clear option in datePicker

4 years ago

I have the same issue. One major reason I opted to utilize the
datepicker in my application is so that I didn't have to go through
the mess that goes along with ensure the user inputs a valid date on
the client. I do this by setting readonly="readonly" on the input as
suggested below, however, if I do that of course the user can't edit
the value in the field even by backspacing (and I don't want them
to). I can't rely on some inherent knowledge on the part of the users
to know that ctrl+end clears the value. Therefore, I agree that it
would be a mistake to remove the clear option from the datepicker ui.

Re: No clear option in datePicker

4 years ago

If a strong case for the Clear button is made I don't see why we can't put it back in to be honest. The clear option was deemed unnecessary because one could always use the backspace in an input box but I can see that won't work for a read-only box.

Re: No clear option in datePicker

3 years ago

Is there any news on the Clear option? I am also using a readonly textbox because I want to force the user to enter dates through the calendar widget, but I also would like a convenient way to wipe out the date. If this cannot be done through this widget, then I'll have to add an additional image linked to some javascript to do it. Would REALLY by nice to have this functionality within this single widget.

- Robert -

Re: No clear option in datePicker

3 years ago

I agree, ponggod. It's an obvious function that I'm surprised was removed. It should at most been made optional.

I've found datepicker to be a great ad-on to our site, and its been great at allowing us to keep the formats of dates entered into the fields uniform without the chance of user error (which is a strong possibility since our customers aren't always data entry experts). I've made sure to keep my fields readonly='readonly' but it looks like I'm going to have to put manual "Clear" buttons next to all of the fields just in case a user accidentally adds a date to an incorrect field.

The forms the users are filling out have a lot of date items, but it is possible they won't have the data on-hand to fill in everything, and our program has no problem with that. Anything we do require be filled we either have checks on (alerting the users they need to enter that bit before submitting the form), or the dates are set to a default upon the record's creation. A simple little "clearButton: true" or "clearButton: false" line to turn on or off the button in the picker itself would make the widget much better and help us keep the page clean of extra buttons.

Re: No clear option in datePicker

2 years ago

PLEASE put this back in! Setting the readonly attribute is extremely useful, and optional dates are not exactly uncommon.

Not having a clear option on the datepicker means that even in an intranet environment on a common controlled platform you have to either write your own clear code, or create unecessary UI friendly server validation for anything that gets past constrainInput.

In this scenario, all you should need is a single jQuery call to validate all date fields on the page.

Reageren: No clear option in datePicker

2 years ago

PLEASE put this back in! Setting the readonly attribute is extremely useful, and optional dates are not exactly uncommon.

I agree with that! I'm also missing this button and use readonly on my fields.

Re: No clear option in datePicker

2 years ago

Ditto here. Why was this removed? It's pretty critical if you have an hidden alternate field.

Re: No clear option in datePicker

2 years ago

A clear button is a requirement for the project I'm working on too. The field is read-only and needs a way to clear the value.

I just started using the JQuery Date Picker, and I've been searching and searching for a way to clear the date field without adding a button to my form. I was really surprised to find that there used to be a button, but it was removed. The date picker is a great widget, but the one glaring omission I see is the lack of a Clear button for the read-only case. May I suggest that there be an option to add the clear button when needed? Thank you.

Re: No clear option in datePicker

2 years ago

Ditto Ditto Ditto.... I "need" this functionality... Thanks for listening!

Re: No clear option in datePicker

2 years ago

I can't see the return of this option. Will it ever re-appear. Else I'm going to have to write extra code to clear the field

Re: No clear option in datePicker

8 months ago

Well this is an old thread, but I found myself also looking for the answer to this. I'm not a very good programmer, but I was able to figure out a fairly simple hack.

I noticed there is an onClose event supported by datepicker. I turned on the button panel and changed the text of the right button to Clear using the closeText option. I then wrote a simple onClose function that checks the contents of the button and I clear the value in the input box if it matches.

Probably better explained by the code:

$(document).ready(function () {
$(function() {
  $('.dp').datepicker({
   buttonImage: 'gfx/cal-icon.gif',
   buttonImageOnly: true,
   showOn: 'both',
   dateFormat: 'm/d/y',
   showButtonPanel: true,
   onClose: function(e) {
    var ev = window.event;
    if (ev.srcElement.innerHTML == 'Clear')
     this.value = "";
   },
   closeText: 'Clear',
   buttonText: ''
  });
});
});

mutanic

Re: No clear option in datePicker

6 months ago

Thanks bro, I got this to solve my issue already.

Re: No clear option in datePicker

6 months ago

@yugocode

$(document).ready(function () {
$(function() {
$('.dp').datepicker({
buttonImage: 'gfx/cal-icon.gif',
buttonImageOnly: true,
showOn: 'both',
dateFormat: 'm/d/y',
showButtonPanel: true,
onClose: function(e) {
var ev = window.event;
if (ev.srcElement.innerHTML == 'Clear')
this.value = "";
},
closeText: 'Clear',
buttonText: ''
});
});
});

This works great in IE but not in Firefox

Do you have a fix please?