JQuery 1.7.1 does not properly set tabindex property on cloned element in IE7

Reported by:	M8R-xm2ocg@mailinator.com	Owned by:	mikesherov
Priority:	low	Milestone:	1.8.3
Component:	attributes	Version:	1.7.1
Keywords:	ie7 clone	Cc:
Blocked by:		Blocking:

Description

JQuery 1.7.1 does not properly set tabindex property on cloned element in IE7. This works in both Firefox and Chrome. It also works in IE7 when using jQuery 1.6.2.

Steps To Reproduce: Click each button in order from left to right, noting the tab order after each click.

<html>
  <head>
<!--     <script type="text/javascript" src="jquery-1.6.2.min.js"></script> -->
    <script type="text/javascript" src="jquery-1.7.1.min.js"></script>

    <script type="text/javascript">
      var indexOrder = new Array(1, 3, 5, 2, 4);

      $(function() {
        $("#crazyTabIndexButton").click(function(event) {
          event.preventDefault();
          setCrazyTabIndexes($(this).parents("form"));
        });

        $("#cloneButton").click(function(event) {
          event.preventDefault();
          var clone = $("form").filter(":first").clone();
          $("#formContainer").append(clone);
        });

        $("#resetUsingJqueryButton").click(function(event) {
          event.preventDefault();
          resetTabIndexesUsingJquery();
        });

        $("#resetUsingJavascriptButton").click(function(event) {
          event.preventDefault();
          resetTabIndexesUsingJs();
        });
      });

      function setCrazyTabIndexes() {
        $("form :input").each(function(index, input) {
          $(input).prop("tabindex", indexOrder[index]);
        });
      }

      function resetTabIndexesUsingJquery() {
        var newIndex = 0;
        $("form :input").each(function(index, input) {
          $(input).prop("tabindex", ++newIndex);
        });
      }

      function resetTabIndexesUsingJs() {
        var newIndex = 0;
        $("form :input").each(function(index, input) {
          input.setAttribute("tabIndex", ++newIndex);
        });
      }
    </script>
  </head>

  <body>
    <h3>JQuery 1.7.1 does not properly set tabindex property on cloned element in IE7</h3>

    Steps To Reproduce:  Click each button in order from left to right, noting the tab order after each click.
    <br/><br/>

    <button id="crazyTabIndexButton">Set Crazy Tab Indexes</button>
    <button id="cloneButton">Clone Form</button>
    <button id="resetUsingJqueryButton">Reset Tab Indexes using JQuery</button>
    <button id="resetUsingJavascriptButton">Reset Tab Indexes Using Plain JS</button>

    <div id="formContainer">
      <form>
        <div>0: <input type="text" /></div>
        <div>1: <input type="text" /></div>
        <div>2: <input type="text" /></div>
        <div>3: <input type="text" /></div>
        <div>4: <input type="text" /></div>
      </form>
    </div>
  </body>
</html>

Attachments (0)

Change History (8)

Changed December 02, 2011 11:09PM UTC by anonymous comment:1

http://jsfiddle.net/VauK7/

Changed December 05, 2011 11:44AM UTC by sindresorhus comment:2

component:	unfiled → attributes
priority:	undecided → low
status:	new → open

jQuery successfully clones the elements tabIndex, but is not able to set the "tabindex" on the cloned elements in IE7.

This problem is only apparent in the real IE7, not IETester or IE7 mode in IE8/9.

Changed June 26, 2012 01:53PM UTC by dmethvin comment:3

keywords:	→ ie7 clone

Changed September 04, 2012 02:40AM UTC by mikesherov comment:4

milestone:	None → 1.8
owner:	→ mikesherov
status:	open → assigned

This was inadvertently fixed by https://github.com/jquery/jquery/commit/3e2a77c5e882b5fc88bf5469ea00067833a2a059 in 1.8.

timmywil, do we need a unit test for this? If so, I'll write one. Otherwise, I can close.

Changed September 04, 2012 02:56PM UTC by timmywil comment:5

A test for this would be awesome. Thanks Mike!

Changed September 29, 2012 04:30AM UTC by mikesherov comment:6

https://github.com/jquery/jquery/pull/937

Changed October 01, 2012 12:45AM UTC by Mike Sherov comment:7

resolution:	→ fixed
status:	assigned → closed

Fix #10943, tabindex not set properly on clone in IE7. Close gh-937.

This is only a unit test fix because the bug was tangentially fixed by a different commit

Changeset: f9ef91d6d68dc7317bb12c1ae2a8201f28facff1

Changed October 01, 2012 04:45PM UTC by dmethvin comment:8

milestone:	1.8 → 1.8.3

Side navigation

#10943 closed bug (fixed)