JQuery Autocomplete style: match parent text input's style?

The best thing you can do is apply a class to your autocomplete field, and then apply the same class to your autocomplete control.

The best thing you can do is apply a class to your autocomplete field, and then apply the same class to your autocomplete control. So, for example if you have something like: Then your jquery could do this: $("#autocomplete-results"). Attr('class', $("#fieldID").

Attr('class')); Of course you could always just modify your HTML to have this: Then, in your CSS, instead of using #fieldID as your selector, you would use . Autocomplete Finally, if you wanted to just copy certain styles over and didn't want to worry about classes and such, you could use something like this: jQuery CSS plugin that returns computed style of element to pseudo clone that element?

Adding classes isn't really an option. The style might need to be different for each of N autocomplete's on a page. And that still doesn't answer how to actually get a hold of the autocomplete's UL so I can monkey with it's style.

– Mark Storer Jun 15 '11 at 21:53 Wait, you're expecting me to actually read your whole question? IMPOSSIBLE. Which autocomplete plugin are you using?

– Jordan Jun 15 '11 at 21:56 but the jQuery CSS plugin sounds like a move in the right direction. Thanks for the link. – Mark Storer Jun 15 '11 at 21:56 the built in one released with jqueryUI – Mark Storer Jun 15 '11 at 22:05.

So I think something like this will work. Use "appendTo" when creating the autocomplete so we can find it with a selector. "For this list of style attributes, get the style from the input field, and set it into the autocomplete UL.So the script would look something like: function addAutoComplete(inputID) { var wrapperDiv = document.

CreateElement( "div" ); var wrapperID = inputID + "__wrapper"; wrapperDiv. SetAttribute( "id", wrapperID ); var inputSelector = $( "#"+inputID ); var autoCompSelector = $("#" + wrapperID + ":first-child" ); inputSelector. AutoComplete( {..., appendTo: wrapperID} ); var attrs = "font-size", "font-family", "color", "background-color", "border", ...; for (var curAttrIdx = 0; curAttrIdx under the has a style class, as does the within the .

Just to make life more exciting, a selector to pick out the links seems like it would be Quite Brittle. A small change in the way Autocomplete works between versions could easily break the selector. None the less, changing the selector to "#" + wrapperID + ":first-child li a" will work for the current version of jQueryUI (1.8.13 as I write this).

After several hours of experimentation, I came up with something that works. Finally. The list items (and link) don't exist until the autocompleteopen event, so I set the style there instead.

Like This: inputSelector. Autocomplete( {source: "foo", "bar", position: { my : "top", at: "bottom"}, minLength:minChars, appendTo: "#" + wrapperID, open: function (event, ui) { autoCompApplyEntryStyles(inputID); } }); function autoCompApplyEntryStyles(inputID) { var inputSelector = $( "#"+inputID ); var wrapperID = inputID + "__wrapper"; var autocompSelector = $("#" + wrapperID + " ul li a"); if (autocompSelector.size() == 0) { return; } var attrs = "font-size", "font-family", "font-weight", "font-style", "color", "background-color", "text-align", "text-decoration"; for (var curAttrIdx = 0; curAttrIdx Length; ++curAttrIdx) { var attrVal = inputSelector. Css( attrs curAttrIdx ); autocompSelector.

Css( attrs curAttrIdx , attrVal ); } }.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.