CODEWITHSUNDEEP
javascriptjquery
Control Freak
Control Freak

Reputation: 13233

How to Skip ReadOnly and Disabled inputs while using .focus()

how would this code be modified so it does not .focus() the first form object if it is readonly or disabled and to skip to the next form input for focus?

Currently it returns an error if the first input box is disabled, but i would also like to skip to the next input box if it's readonly too, and if all inputs are disabled and readonly, then it should not focus anything.. 

    <script language="javascript" type="text/javascript">
    // Focus first element
    $.fn.focus_first = function() {
      var elem = $('input:visible', this).get(0);
      var select = $('select:visible', this).get(0);
      if (select && elem) {
        if (select.offsetTop < elem.offsetTop) {
          elem = select;
        }
      }
      var textarea = $('textarea:visible', this).get(0);
      if (textarea && elem) {
        if (textarea.offsetTop < elem.offsetTop) {
          elem = textarea;
        }
      }

      if (elem) {
        elem.focus();
      }
      return this;
    }
    </script>

Actually using input:enabled:visible fixes alot of my issues, but i'm still trying to figure out if readonly, to skip to the next one.

Upvotes: 0

Views: 3584

Answers (3)

xdazz
xdazz

Reputation: 160853

You need to change the condition to

if (elem && !elem.prop('readonly') && !elem.prop('disable')) {

Upvotes: 0

Control Freak
Control Freak

Reputation: 13233

Well here is the answer anyways for those looking..

 var elem = $('input:enabled:visible:not([readonly="readonly"])', this).get(0);

Upvotes: 2

Hadas
Hadas

Reputation: 10374

use :

$(yourElement).not(":disabled").not(":readonly")

Upvotes: 2

Related Questions