Skip to content
Permalink
Browse files
Autocomplete: Insert the live region before the input. Fixes #9172 - … 
…Autocomplete: .replaceWith() fails to replace.
  • Loading branch information
@scottgonzalez
scottgonzalez committed Mar 21, 2013
1 parent f281ce9 commit ff11b69a67e0176c851ff3bdec997c7a75d47a42
Showing 2 changed files with 11 additions and 1 deletion.
10 tests/unit/autocomplete/autocomplete_core.js
View file
@@ -188,4 +188,14 @@ test( "ARIA", function() {
"Live region for multiple values" );
});

test( ".replaceWith() (#9172)", function() {
expect( 1 );

var element = $( "#autocomplete" ).autocomplete(),
replacement = "<div>test</div>",
parent = element.parent();
element.replaceWith( replacement );
equal( parent.html(), replacement );
});

}( jQuery ) );
2 ui/jquery.ui.autocomplete.js
View file
@@ -296,7 +296,7 @@ $.widget( "ui.autocomplete", {
"aria-live": "polite"
})
.addClass( "ui-helper-hidden-accessible" )
.insertAfter( this.element );
.insertBefore( this.element );

// turning off autocomplete prevents the browser from remembering the
// value when navigating through history, so we re-enable autocomplete

2 comments on commit ff11b69

@michalbcz
Copy link

@michalbcz michalbcz commented on ff11b69 Jan 8, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why is this works? What is a reason that jQuery#replaceWith is sensitive on position of widget element (before vs after) ?

@scottgonzalez
Copy link
Member Author

@scottgonzalez scottgonzalez commented on ff11b69 Jan 8, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When .replaceWith() runs, it removes the input element. When that element is removed, the autocomplete widget automatically destroys itself. When the autocomplete widget is destroyed, the live region is removed. When .replaceWith() does the insertion, it needs to have a reference to an element to insert relative to (it could be the next sibling, the previous sibling, or the parent if there are no siblings). We just have to use the position that happens to work with the current implementation. It's unlikely that the position used by .replaceWith() will change in the future.

Please sign in to comment.