| <!DOCTYPE html> |
| <html> |
| <!-- |
| Copyright 2007 The Closure Library Authors. All Rights Reserved. |
| |
| Use of this source code is governed by the Apache License, Version 2.0. |
| See the COPYING file for details. |
| --> |
| <!-- |
| --> |
| <head> |
| <title>goog.ui.ac.Remote</title> |
| <script src="../base.js"></script> |
| <script> |
| goog.require('goog.ui.ac.AutoComplete'); |
| goog.require('goog.ui.ac.InputHandler'); |
| goog.require('goog.ui.ac.Renderer'); |
| goog.require('goog.ui.ac.RemoteArrayMatcher'); |
| goog.require('goog.ui.ac.CachingMatcher'); |
| goog.require('goog.ui.ac.Remote'); |
| </script> |
| <link rel="stylesheet" href="css/demo.css"> |
| <link rel="stylesheet" href="../css/autocomplete.css"> |
| </head> |
| <body> |
| <h1>goog.ui.ac.Remote</h1> |
| |
| Google Buzzwords:<br> |
| <input type="text" id="txtInput" style="width:500px"><br> |
| <p> |
| This data is being pulled from the server at |
| <a href="autocompleteremotedata.js">autocompleteremotedata.js</a>. |
| </p> |
| <p> |
| Ideally the server would perform a search on the query and would only |
| return relevant results; however, this response is static. |
| </p> |
| |
| <script> |
| var input = document.getElementById('txtInput'); |
| var ac = new goog.ui.ac.Remote('autocompleteremotedata.js', |
| input); |
| </script> |
| |
| <h1>goog.ui.ac.CachingMatcher on top of goog.ui.ac.RemoteArrayMatcher</h1> |
| |
| Google Buzzwords:<br> |
| <input type="text" id="txtInput2" style="width:500px"><br> |
| <p> |
| This data is being pulled from the server at |
| <a href="autocompleteremotedata.js">autocompleteremotedata.js</a>. |
| </p> |
| <p> |
| This sets up a client-side cache of suggestions from the server, and matches |
| against the client cache when the user types, while simultaneously making |
| requests to the server in the background. The result feels more responsive |
| than the goog.ui.ac.Remote, which has no client cache. |
| </p> |
| |
| <script> |
| var input = document.getElementById('txtInput2'); |
| |
| var matcher = new goog.ui.ac.CachingMatcher( |
| new goog.ui.ac.RemoteArrayMatcher('autocompleteremotedata.js')); |
| // Note - we specify a very low throttle time (10ms) because we are serving |
| // these responses directly from the client cache. By default, the |
| // CachingMatcher already throttles the requests to its underlying matcher |
| // to 1 request every 300ms. |
| var inputHandler = new goog.ui.ac.InputHandler(null, null, false, 10); |
| var renderer = new goog.ui.ac.Renderer(); |
| |
| var autoComplete = new goog.ui.ac.AutoComplete( |
| matcher, renderer, inputHandler); |
| inputHandler.attachAutoComplete(autoComplete); |
| inputHandler.attachInputs(input); |
| </script> |
| </body> |
| </html> |
