[solved] Help needed for editing appaerance of ac_results (ajax search).

[janthemanson]

Hey there,

 

I need some help for editing the appaerance/position of the instant ac_results.

 

I want to transplant the searchbox as a menu item on the right. So far so good - I got the searchbox transplanted. But I like to get the instant search results, displayed in the ac_results list, as a "dropdown". Currently it looks similar, but I didn't notice the ac_results in the page source view.

Firefox Inspector shows them at the bottom of the page.

 

So if I understand this correct - it seems the searchresults were rendered at the bottom of the page ... if yes, is there a way to get them as a child of the search-form?

 

Every help is appreciated. Thanks Jan

 

[solved] I got help from the author of my theme. He found the line to change in jquery.autocomplete.js:

 

function init() {
 if (!needsInit)
  return;
 element = $("<div/>")
 .hide()
 .addClass(options.resultsClass)
 .css("position", "absolute")
 .appendTo(document.body);

Change the last line to your #id where you want the code to fit in.

function init() {
 if (!needsInit)
  return;
 element = $("<div/>")
 .hide()
 .addClass(options.resultsClass)
 .css("position", "absolute")
 .appendTo("#your_id_where_the_code_should_fit_in");

I also commented the css definitions out to use the styles defined in the theme css file.

show: function() {
  var offset = $(input).offset();
  element.css({
/*width: typeof options.width == "string" || options.width > 0 ? options.width : $(input).width(),
top: offset.top + input.offsetHeight,*/
  }).show();

Edited May 13, 2013 by janthemanson (see edit history)