root/public/javascripts/scriptaculous/test/functional/ajax_inplaceeditor_test.html

Revision 1, 4.1 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 Demo</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    .inplaceeditor-saving { background: url(wait.gif) bottom right no-repeat; }
12  </style>
13</head>
14<body>
15<h1>script.aculo.us Demo</h1>
16<p>
17  Demo of the Ajax.InPlaceEditor.
18</p>
19
20<h1 id="tobeedited">To be edited</h1>
21<script>
22new Ajax.InPlaceEditor($('tobeedited'), '_ajax_inplaceeditor_result.html', {
23        ajaxOptions: {method: 'get'} //override so we can use a static for the result
24        });
25</script>
26
27<h1 id="tobeeditedblur">To be edited w/ blur</h1>
28<script>
29new Ajax.InPlaceEditor($('tobeeditedblur'), '_ajax_inplaceeditor_result.html', {
30        submitOnBlur: true, okButton: false, cancelLink: true,
31        ajaxOptions: {method: 'get'} //override so we can use a static for the result
32        });
33</script>
34
35<h1 id="tobeeditedoklink">To be edited w/ okLink and cancelButton</h1>
36<script>
37new Ajax.InPlaceEditor($('tobeeditedoklink'), 
38  '_ajax_inplaceeditor_result.html', {
39  okButton: false, 
40  okLink: true,
41  cancelButton: true,
42  cancelLink: false,
43  textBeforeControls: ' ---> ',
44  textBetweenControls: ' | ',
45  textAfterControls: ' <--- ',
46  ajaxOptions: {method: 'get'} //override so we can use a static for the result
47});
48</script>
49
50<h1 id="tobeeditedoklinkonly">To be edited w/ okLink only </h1>
51<script>
52new Ajax.InPlaceEditor($('tobeeditedoklinkonly'), 
53  '_ajax_inplaceeditor_result.html', {
54  okButton: false, 
55  okLink: true,
56  cancelButton: false,
57  cancelLink: false,
58  textBeforeControls: ' ---> ',
59  textBetweenControls: ' | ',  // will not be used, as one control only
60  textAfterControls: ' <--- ',
61  ajaxOptions: {method: 'get'} //override so we can use a static for the result
62});
63</script>
64
65
66<span id="tobeedited2">With external edit control and custom parameter name</span> &nbsp; <a id="tobeedited2EditControl" href="#">edit</a>
67<script>
68new Ajax.InPlaceEditor($('tobeedited2'), '_ajax_inplaceeditor_result.html', {
69    externalControl: 'tobeedited2EditControl',
70    paramName: 'foobar',
71    ajaxOptions: {method: 'get'} //override so we can use a static for the result
72    });
73</script>
74
75<table>
76  <tbody>
77    <tr>
78      <td><span id="tobeeditedTD">test</span></td>
79      <td><a id="tobeeditedTDEditControl" href="#">edit</a></td>
80    </tr>
81  </tbody>
82</table>
83
84<script>
85new Ajax.InPlaceEditor($('tobeeditedTD'), '_ajax_inplaceeditor_result.html', {
86    externalControl: 'tobeeditedTDEditControl'
87    });
88</script>
89
90<p id="tobeedited3">Multi row editor: Lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum lorum ipsum</p>
91<script>
92new Ajax.InPlaceEditor($('tobeedited3'), '_ajax_inplaceeditor_result.html', {
93    rows:5,
94    ajaxOptions: {method: 'get'} //override so we can use a static for the result
95    });
96</script>
97
98<p id="tobeedited4">Loads text from server</p>
99<script>
100new Ajax.InPlaceEditor($('tobeedited4'), '_ajax_inplaceeditor_result.html',
101    {ajaxOptions: {method: 'get'}, //override so we can use a static for the result and to load the text
102    loadTextURL: '_ajax_inplaceeditor_text.html'
103    });
104</script>
105
106<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
107<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
108<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
109
110<h1 id="tobeeditedFarDown">Editor very far down to test scrolling bug</h1>
111<script>
112new Ajax.InPlaceEditor($('tobeeditedFarDown'), '../unit/_ajax_inplaceeditor_result.html');
113</script>
114
115</body>
116</html>
Note: See TracBrowser for help on using the browser.