Скриптакулярная проблема положения списка результатов автозаполнения - PullRequest
Новая
       35

Скриптакулярная проблема положения списка результатов автозаполнения

2 голосов
/ 17 августа 2011

Я использую Scripatculous Autocompleter 1.9.0.Моя проблема в том, что позиция списка результатов div неверна в Chrome и Firefox, но работает в IE.Div списка результатов появляется в верхней части текстового поля.Я смог изменить файл controls.js и исправить проблему, но мне интересно, что я делаю не так с таблицей стилей.Вот мой код: 

style.css:
div#autocomplete
{
  position: relative;
}

input#query {
  width:500px;
}

div#answerlist {
  width:500px;
  max-height:700px;
  overflow-y:scroll;
  overflow-x:auto;
  border:1px solid #CCCCCC;
}

index.phtml:

<div id="webphone" style="width: 1000px">
<center>
<label>Search:</label>
<input type="text" name="query" id="query"></input>
</center>
<div id="answerlist"></div>
</div>

<script type="text/javascript">
new Ajax.Autocompleter("query","answerlist","index/search", {frequency: 0.5, minChars: 1});
</script>

Я попытался удалить вложенные элементы div и многие другие варианты «позиции» для всех элементов.Ничего не помогло.

Затем я начал играть с функцией control.js Autocompleter.create и функцией onShow: 

 controls.js:

 function(element, update){
    if(!update.style.position || update.style.position=='absolute') {
      /***alert(update.style.position);***/
      update.style.position = 'absolute';
      Position.clone(element, update, {
       setHeight: false,
        offsetTop: element.offsetHeight
      });
    }
    Effect.Appear(update,{duration:0.15});
  };

Во-первых, функция оповещения всегда возвращает пустую строку, даже еслиЯ явно устанавливаю стиль позиции списка ответов на относительный или абсолютный.Во-вторых, даже если скрипт явно делает позицию абсолютной и позиционирует элемент, конечная позиция неверна!Я единственный, кто испытывает это?Я пробовал много версий Chrome и Firefox, как на Linux, так и на Windows.Я должен делать что-то не так.Конечно, я могу решить эту проблему, закомментировав эту часть кода и разместив элемент div с помощью абсолютного позиционирования.Но я предпочитаю этого не делать ...

1 Ответ

4 голосов
/ 29 ноября 2011

После борьбы с той же проблемой, я нашел решение и открыл тикет на https://prototype.lighthouseapp.com/projects/8886/tickets/1286-error-in-elementcloneposition#ticket-1286-1

Исправление описано там, но в основном Element.clonePosition имеет следующее: 

if (parent == document.body) {
    delta[0] -= document.body.offsetLeft;
    delta[1] -= document.body.offsetTop;
}

Это должно быть заменено на: 

if (parent == document.body) {
    var parentOffset = Element.viewportOffset(parent);
    delta[0] -= parentOffset[0];
    delta[1] -= parentOffset[1];
}
...