root/public/javascripts/scriptaculous/test/functional/ajax_autocompleter_test.html @ 10

Revision 1, 2.5 kB (checked in by falcon, 17 years ago)

Version one -> initial work from the laptop.
Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
2        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
4<head>
5  <title>script.aculo.us Autocompleter functional test file</title>
6  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
7  <script src="../../lib/prototype.js" type="text/javascript"></script>
8  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
9  <script src="../../src/unittest.js" type="text/javascript"></script>
10  <style type="text/css" media="screen">
11    .selected { background-color: #888; }
12  </style>
13</head>
14<body>
15<h1>script.aculo.us Autocompleter functional test file</h1>
16
17
18Autocompleter ac1 (updated panel is relative, so no overlapping should occur): <input id="ac1" name="ac1" type="text"/>
19<div id="ac1update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
20
21<script type="text/javascript" language="javascript" charset="utf-8">
22// <![CDATA[
23  new Ajax.Autocompleter('ac1','ac1update','_autocomplete_result.html');
24// ]]>
25</script>
26
27<br/>
28
29Autocompleter ac2 w/ parameters: <input id="ac2" type="text" name="ac2"/>
30<div id="ac2update" style="display:none;border:1px solid black;background-color:white;"></div>
31
32
33<script type="text/javascript" language="javascript" charset="utf-8">
34// <![CDATA[
35  new Ajax.Autocompleter('ac2','ac2update','_autocomplete_result.html',{parameters:'a=b&b=c'});
36// ]]>
37</script>
38
39<br/>
40
41Autocompleter ac3 (nested in postion:relative div, selects "selectme" class):
42<br/> 
43<div style="position:relative">
44<input id="ac3" type="text"/>
45<div id="ac3update" style="display:none;border:1px solid black;background-color:white;"></div>
46</div>
47
48<script type="text/javascript" language="javascript" charset="utf-8">
49// <![CDATA[
50  new Ajax.Autocompleter('ac3','ac3update','_autocomplete_result.html',{select:'selectme'});
51// ]]>
52</script>
53
54<br/><select><option>First Item</option><option>Second Item</option><option>Third Item</option></select>
55
56<br/><br/>
57Autocompleter ac4 (autoselects option if single single option is returned):
58<br/> 
59<input id="ac4" type="text"/>
60<div id="ac4update" style="display:none;border:1px solid black;background-color:white;"></div>
61
62<script type="text/javascript" language="javascript" charset="utf-8">
63// <![CDATA[
64  new Ajax.Autocompleter('ac4','ac4update','_autocomplete_result_single.html',{select:'selectme',autoSelect:true});
65// ]]>
66</script>
67
68<div id="debug" style="font-size:11px;"></div>
69
70</body>
71</html>
Note: See TracBrowser for help on using the browser.