0

CakePHP の Ajax ヘルパー (現在は 1.2.3.8166) を使用して、結果の $ajax->autoComplete リストを提供し、マウス (およびマウス ホイールを使用して) 結果をスクロールする場合、レンダリングされたビューとして結果リストを返します。 、 すべては順調です。一方、矢印キーを使用すると、ビューがぎこちなくスクロールするという厄介な効果があります。下に押すと、選択ボックスとページ全体がブラウザーのビューペインの下部に移動します。上に押すと、上に移動するのとは逆の効果があります。

他の誰かがこの動作に気づき、何か考えましたか? 結果のリストは、たとえば次のコードによって提供されます (これは、コントローラーの autoComplete() 関数から $people を取得します)。

<ul>
<?php foreach($people as $person): ?>
<li><?php echo $person['Person']['id']; ?></li>
<?php endforeach; ?>
</ul>

（あくまで一例で、実際にidと名前・苗字・商号を表示しています）。

リストの CSS は次のとおりです。

div.auto_complete {
    position: absolute;
    width: 250px;
    background-color: white;
    border: 1px solid #888;
    margin: 0px; padding: 0px;
}
div.auto_complete ul{
    list-style: none;
    margin: 0px;
}
4

1 に答える 1

2

この問題に対する回答は、cake-php ニュースグループ ( http://groups.google.com/group/cake-phpで入手可能) で受け取りました。ポスターは解決策のあるこのページを指していたので、ここにコピーします。

  1. controls.js ファイルを開きます ( にあるはずですapp/webroot/js) 。

  2. markPrevious 関数を検索して、次のように変更します。

    markPrevious: function() {
    if (this.index > 0) {
        this.index--;
    } else {
        this.index = this.entryCount-1;
        this.update.scrollTop = this.update.scrollHeight;
    }
    selection = this.getEntry(this.index);
    selection_top = selection.offsetTop;
    if (selection_top < this.update.scrollTop) {
        this.update.scrollTop = this.update.scrollTop-
        selection.offsetHeight;
    }
},

  3. markNext 関数を検索して、次のように変更します。

    markNext: function() {
    if(this.index < this.entryCount-1) {
        this.index++;
    } else {
        this.index = 0;
        this.update.scrollTop = 0;
    }
    selection = this.getEntry(this.index);
    selection_bottom = selection.offsetTop+selection.offsetHeight;
    if(selection_bottom > this.update.scrollTop+this.update.offsetHeight) {
        this.update.scrollTop = this.update.scrollTop + selection.offsetHeight;
    }
  },

  4. updateChoices 関数を検索し、行を変更します。

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

    に

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

  5. 最後に、動作を試します。最初にうまくいかない場合はapp/tmp/cache、ブラウザのキャッシュ内のキャッシュ ファイルを削除 (またはお気に入りのサーバー側のキャッシュをクリア) してから、もう一度試してください。クリアapp/tmp/cacheは私のために働いた。

于 2009-07-31T12:21:11.430 に答える