Harry
Harry

Reputation: 548

Flex DateField validate date with Editable = True

We have a Datefield component with Editable = true

<mx:DateField id="startDate"  
                                  width="120"
                                  editable="true"
                                  formatString="MM/DD/YYYY"
                                  selectableRange="{{rangeStart : new Date(2010,0,1), rangeEnd : new Date()}}"
                                  showToday="true"
                                  labelFunction="formatDate" 
                                  restrict="[0-9] '\/'" change="startDate_clickHandler(event)"
                                  yearNavigationEnabled="true" 
                                  text="{}" tabIndex="15" />

The Calendar has everything we want (able to choose a valid date only after 01/01/2010). Now the issue is that if the user enters (Editable = true) an invalid date or any date < 01/01/2010, how can i validate that and show an alert saying that the date is invalid. Please any help on this would be appreciated.

Thanks

Harish

Upvotes: 0

Views: 8108

Answers (4)

Rahul Singhai
Rahul Singhai

Reputation: 1339

You can do it in following way.

  • If user specifies does not specify anything (or spaces), then it treats it as if user wants to clear the selected date.
  • If user specifies an invalid date, then it falls back to today's date. You can also change this logic to alert the user about invalid date by setting the errorString poperty of the DateField component.
  • For a date before range start date, it falls back to range start date.
  • For a date after range end date, it falls back to range end date.

<fx:Script>
    <![CDATA[
        import mx.controls.DateField;
        import mx.utils.StringUtil;

        private function parseStartDate(valueString:String, inputFormat:String):Date
        {
            if (StringUtil.trim(valueString) == "")
                return null;

            var date:Date = DateField.stringToDate(valueString, inputFormat);
            if (date == null)
                date = new Date(startDate.selectableRange.rangeEnd.time);
            else if (date.time < startDate.selectableRange.rangeStart.time)
                date = new Date(startDate.selectableRange.rangeStart.time);
            else if (date.time > startDate.selectableRange.rangeEnd.time)
                date = new Date(startDate.selectableRange.rangeEnd.time);
            return date;
        }
    ]]>
</fx:Script>

<mx:DateField id="startDate"
    width="120"
    selectableRange="{{rangeStart : new Date(2010,0,1), rangeEnd : new Date()}}"
    showToday="true"
    yearNavigationEnabled="true"
    parseFunction="parseStartDate"
    editable="true"
    formatString="MM/DD/YYYY"
    restrict="[0-9/]"/>

Upvotes: 0

Mauricio Gracia Gutierrez
Mauricio Gracia Gutierrez

Reputation: 10844

Maybe you could try a different aproach after seeing all this great examples

http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7d9b.html#WS2db454920e96a9e51e63e3d11c0bf69084-7db3

Upvotes: 0

lxj
lxj

Reputation: 11

The DateField component has a valueCommit event that you can listen to. So you can attach a handler to that event and do the validation as required.

Upvotes: 1

Christophe Herreman
Christophe Herreman

Reputation: 16085

The DateField component has a "dataChange" event that you can listen to. So you can attach a handler to that event and do the validation as required.

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/controls/DateField.html#event:dataChange

Upvotes: 1

Related Questions