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

Blur after tabbing out of non-input widget in bandpopup closes the popup

XMLWordPrintable

    • Icon: Bug Bug
    • Resolution: Fixed
    • Icon: Normal Normal
    • 8.5.2
    • 8.0.4.2
    • None
    • Security Level: Jimmy
    • None

      Steps to Reproduce

      http://zkfiddle.org/sample/10afek6/1-Bandbox-close-on-non-input-tab-out
      run fiddle
      Open the bandbox
      Click to put focus in 1st child of bandpopup
      Use tab key to focus checkbox
      Use tab again

      Current Result

      When pressing tab key on checkbox in bandpopup, the bandbox closes

      Expected Result

      When pressing tab key on checkbox in bandpopup, bandbox should not close and next child should receive focus.

      Debug Info

      https://github.com/zkoss/zk/blob/v8.0.4.2/zul/src/archive/web/js/zul/inp/ComboWidget.js#L546

      Root Cause

      Bandbox doesn't close on tab pressed in inputwidget, but the rule doesn't prevent closing when tabbing out of any focusable widget not instance of inputwidget

      Workaround

      Based on 8.0.4.2

      	<script><![CDATA[
      	zk.afterLoad('zul.inp', function() {
      		var xComboWidget = {};
      		zk.override(zul.inp.ComboWidget.prototype, xComboWidget ,{
      			_doKeyDown: function (evt) {
      				var keyCode = evt.keyCode,
      					bOpen = this._open;
      				if ((evt.target == this || !(evt.target.$instanceof(zul.inp.InputWidget) || evt.target.$instanceof(zul.wgt.Checkbox)))// Bug ZK-475
      						&& (keyCode == 9 || (zk.webkit && keyCode == 0))) { //TAB or SHIFT-TAB (safari)
      					if (bOpen) this.close({sendOnOpen: true});
      					return;
      				}
      	
      				if (evt.altKey && (keyCode == 38 || keyCode == 40)) {//UP/DN
      					if (bOpen) this.close({sendOnOpen: true});
      					else this.open({sendOnOpen: true});
      	
      					//FF: if we eat UP/DN, Alt+UP degenerate to Alt (select menubar)
      					var opts = {propagation: true};
      					if (zk.ie < 11) opts.dom = true;
      					evt.stop(opts);
      					return;
      				}
      	
      				//Request 1537962: better responsive
      				if (bOpen && (keyCode == 13 || keyCode == 27)) { //ENTER or ESC
      					if (keyCode == 13) this.enterPressed_(evt);
      					else this.escPressed_(evt);
      					return;
      				}
      	
      				if (keyCode == 18 || keyCode == 27 || keyCode == 13
      				|| (keyCode >= 112 && keyCode <= 123)) //ALT, ESC, Enter, Fn
      					return; //ignore it (doc will handle it)
      	
      				if (this._autodrop && !bOpen)
      					this.open({sendOnOpen: true});
      	
      				if (keyCode == 38) this.upPressed_(evt);
      				else if (keyCode == 40) this.dnPressed_(evt);
      				else this.otherPressed_(evt);
      			}
      		});//zk.override
      	});//zk.afterLoad
      	]]></script>
      

            CharlesQiu CharlesQiu
            MDuchemin MDuchemin
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 1 day
                1d
                Remaining:
                Time Spent - 2 hours Remaining Estimate - 6 hours
                6h
                Logged:
                Time Spent - 2 hours Remaining Estimate - 6 hours
                2h