3

我正在使用效果很好的 ajax-autocompleter。我的目标是在现有项目的编辑功能或未找到项目的创建功能之间重定向。

我为每个 li 插入一个特定的 id,因此我可以将它用于带有 afterUpdateElement 选项的编辑功能。

但是如果没有找到结果,则列表是空的,我找不到任何方法告诉 afterUpdateElement 脚本没有找到结果。实际上,没有调用 afterUpdateElement,因为没有选择。所以 afterUpdateElement 没用……</p>

我正在考虑测试 ajax 请求发送的全部值。但是我没有找到如何抓住它......</p>

4

2 回答 2

1

所以,我终于找到了一种方法来检查结果是否被选中(在 Gwyohm 的巨大帮助下):

  1. 首先,我们设置了一个隐藏字段,它将记录是否选择了结果(真/假)。默认情况下,它设置为 FALSE。
  2. afterUpdateElement 仅在选择后使用。所以我们使用这个 aferUpdateElement 将我们的隐藏字段变为 TRUE。
  3. 如果用户更改了搜索字段值,对于未选择的全新值,不使用 afterUpdateElement,我们的隐藏值仍然设置为 TRUE。该问题的解决方案是聆听按下的键。如果按下某个键,则隐藏字段将返回 FALSE。这适用于所有键,甚至是实际用于进行选择的 Enter 键。所以这是一个我们应该从按键监听器中移除的异常。所以,最后让我们看看我们的额外功能:

    $(id-of-text-field).observe("keyup", function(e) {

    if (window.event) keycode = window.event.keyCode;
    else if (e) keycode = e.which;
    如果(键码!= 13){

    $(id-of-hidden-field).value="FALSE";

    }

    }.bindAsEventListener($(id-of-text-field)));

然后我们可以使用隐藏字段来了解是否应该编辑或创建文本值......

注意:使用此解决方案,如果用户键入与现有值匹配的值,但未选择它,它将被视为新值,如果将此值添加到数据库中,则会导致重复条目。(但这对我来说没问题,因为我正在处理名字,两个不同的人可能有相同的名字......)

于 2009-03-19T13:34:48.663 回答
1

您可以尝试像这样覆盖 updateChoices 方法:

Ajax.Autocompleter.prototype.updateChoices =  function (choices) {
if(!this.changed && this.hasFocus) {

      if(!choices) {
        //do your "new item" thing here
      }
      else {
         this.update.innerHTML = choices;
         Element.cleanWhitespace(this.update);
         Element.cleanWhitespace(this.update.down());

         if(this.update.firstChild && this.update.down().childNodes) {
           this.entryCount =
             this.update.down().childNodes.length;
           for (var i = 0; i < this.entryCount; i++) {
             var entry = this.getEntry(i);
             entry.autocompleteIndex = i;
             this.addObservers(entry);
           }
         } else {
           this.entryCount = 0;
         }

         this.stopIndicator();
         this.index = 0;

         if(this.entryCount==1 && this.options.autoSelect) {
           this.selectEntry();
           this.hide();
         } else {
           this.render();
         }
      }
   }
}

在controls.js 中覆盖不是一个好主意。相反,您可以将其添加到新的 .js 中,并将其包含在库之后。

编辑:pff .. 抱歉缩进不好,但它是从 TextMate 复制/粘贴的,并且有制表符和空格。我希望你明白这一点。我唯一添加的是

      if(!choices) {
        //do your "new item" thing here
      }
      else {}

堵塞。另外,我没有测试代码,但我认为它应该可以工作。

于 2009-03-19T13:38:35.067 回答