Member Avatar for manzoor.ilahi77

I need not to focus on readonly input and when user tab it should jump to next write field.

    <input type="text" name="first"></input>
    <input type="text" name="second" readonly="readonly"></input>
    <input type="text" name="third"></input>
    <input type="text" name="fourth"></input>
    <input type="text" name="fifth" readonly="readonly"></input>
    <input type="text" name="sixth"></input>



<script>
$(document).ready( function(){
    $('input').focus(function(e) {
            var readonly = $(this).attr("readonly");
            if (readonly) {
                $(this).next('input:not([readonly])').focus();
                e.preventDefault();

            }
        });
});
</script>
  • 2 Contributors
  • 1 Reply
  • 1K Views
  • 1 Hour Discussion Span
  • Latest Post Latest Post by stbuchok
Member Avatar for stbuchok

Try something like this (completely untested):

<script>

$('[data-nextElement]').focus(function(){
    $('#' + $(this).attr('data-nextElement')).focus();
});

</script>

...

<form>
<input type="text" id="txtText1" />
<input type="text" id="txtText2" readonly="readonly" data-nextElement="txtText3" />
<input type="text" id="txtText3" />
<input type="text" id="txtText4" />
<input type="text" id="txtText5" readonly="readonly" data-nextElement="txtText6" />
<input type="text" id="txtText6" />
<input type="text" id="txtText7" />
<input type="text" id="txtText8" readonly="readonly" data-nextElement="txtText1" />
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.