Uploaded image for project: 'ZK'
  1. ZK
  2. ZK-3846

use date format in data constraint error messages and localize range separator

    Details

    • Type: New Feature
    • Status: Closed
    • Priority: Normal
    • Resolution: Done
    • Affects Version/s: 8.5.0
    • Fix Version/s: 8.5.2
    • Component/s: Components
    • Security Level: Jimmy
    • Labels:

      Description

      Steps to Reproduce

      		<datebox format="dd.MM.yyyy" constraint="between 20000101 and 20100101"/>
      		<datebox format="dd.MM.yyyy" constraint="before 20000101"/>
      		<datebox format="dd.MM.yyyy" constraint="after 20000101"/>
      

      type dates outside the ranges

      Current Result

      the constraint errors always use a the date format "yyyyMMdd"
      The date range separator is always "~" (different locales require different separators)

      Expected Result

      use the configured date format and localize the separator or the whole message

      e.g. the german separator should be 3 dots "..." or the unicode ellipsis character "…" (that's a single char)

      Debug Info

      https://github.com/zkoss/zk/blob/v8.5.0/zul/src/archive/web/js/zul/inp/SimpleDateConstraint.js#L31

      this non localized behavior is also documented
      https://www.zkoss.org/wiki/ZK_Component_Reference/Input/Datebox#Constraint

      Root Cause

      https://github.com/zkoss/zk/blob/v8.5.0/zul/src/archive/web/js/zul/inp/SimpleDateConstraint.js#L76-L80

      Workaround

      	/*Workaround to use the widgets date format in the constraint error message*/
      	zk.afterLoad('zul.inp', function() {
      		var xSimpleDateConstraint = {};
      		zk.override(zul.inp.SimpleDateConstraint.prototype, xSimpleDateConstraint, {
      			validate: function (wgt, val) {
      				if (jq.type(val) == 'date') {
      					var msg = this._errmsg;
      					var v = new Date(val.getFullYear(), val.getMonth(), val.getDate());
      					if (this._beg != null && this._beg.getTime() > v.getTime())
      						return msg['between'] || msg['after'] || this.outOfRangeValue(wgt);
      					if (this._end != null && this._end.getTime() < v.getTime())
      						return msg['between'] || msg['before'] || this.outOfRangeValue(wgt);
      				}
      				return this.$supers('validate', arguments);
      			},
      			outOfRangeValue: function (wgt) {
      				var format = wgt.getFormat() || this.format;
      				return msgzul.OUT_OF_RANGE + ': ' + (this._beg != null ? this._end != null ?
      						new zk.fmt.Calendar(null, this._localizedSymbols).formatDate(this._beg, format) + ' ... '
      							+ new zk.fmt.Calendar().formatDate(this._end, format) :
      							'>= ' + new zk.fmt.Calendar().formatDate(this._beg, format) :
      							'<= ' + new zk.fmt.Calendar().formatDate(this._end, format));
      			}
      		});//zk.override
      	});//zk.afterLoad
      

        Attachments

          Activity

            People

            • Assignee:
              CharlesQiu CharlesQiu
              Reporter:
              cor3000 cor3000
            • Votes:
              1 Vote for this issue
              Watchers:
              2 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Time Tracking

                Estimated:
                Original Estimate - 1 day
                1d
                Remaining:
                Time Spent - 3 hours Remaining Estimate - 5 hours
                5h
                Logged:
                Time Spent - 3 hours Remaining Estimate - 5 hours
                3h