Thomas89 / simplemodal

Automatically exported from code.google.com/p/simplemodal
0 stars 0 forks source link

Include anchor tabs (conditionally?) in the modal's tab key navigation #81

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
Would it be possible to add anchor tags to the modal's tab key navigation?

This would allow users to tab from the last input in a form to Submit and 
Cancel actions, if those actions are links instead of inputs.

Here is what I have working in my project, which assumes a "watchAnchors" 
option:

focus: function (pos) {
   var s = this, p = pos && $.inArray(pos, ['first', 'last']) !== -1 ? pos : 'first';
   var input;

   // focus on dialog or the first visible/enabled input element
   if (s.o.watchAnchors) {
      input = $('a[disabled!="disabled"]:visible, :input:enabled:visible', s.d.wrap);
      input = (pos === 'first') ? input.first() : input.last();
   } else {
       input = $(':input:enabled:visible:' + p, s.d.wrap);
   }

   setTimeout(function () {
      input.length > 0 ? input.focus() : s.d.wrap.focus();
   }, 10);
},

watchTab: function (e) {
   var s = this;

   if ($(e.target).parents('.simplemodal-container').length > 0) {
      // save the list of inputs

      if (s.o.watchAnchors) {
         s.inputs = $.merge($('a[disabled!="disabled"]:visible, :input:enabled:visible', s.d.data[0]).first(), $('a[disabled!="disabled"]:visible, :input:enabled:visible', s.d.data[0]).last());
      } else {
         s.inputs = $(':input:enabled:visible:first, :input:enabled:visible:last', s.d.data[0]);
      }

      // if it's the first or last tabbable element, refocus
      if ((!e.shiftKey && e.target === s.inputs[s.inputs.length -1]) ||
            (e.shiftKey && e.target === s.inputs[0]) ||
            s.inputs.length === 0) {
         e.preventDefault();
         var pos = e.shiftKey ? 'last' : 'first';
         s.focus(pos);
      }
   }
   else {
      // might be necessary when custom onShow callback is used
      e.preventDefault();
      s.focus();
   }
},

Original issue reported on code.google.com by jlit...@gmail.com on 20 Mar 2012 at 1:49