<!DOCTYPE html>
<html>
<!--
Copyright 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.json">autocompleteremotedata.json</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.json',
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.json">autocompleteremotedata.json</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.json'));
// 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>
Codebase Browser
chromium