Gitiles
Code Review Sign In
www.giggi.me / code-igniter-v3-giggi / f743c737d13025336672c99c7c9b8a0dff447d08 / . / user_guide / helpers / form_helper.html
blob: 8eea961091672dc44bc0f318bda5b79965634b72 [file] [log] [blame]
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<html>
3<head>
4
5<title>Code Igniter User Guide</title>
6
7<style type='text/css' media='all'>@import url('../userguide.css');</style>
8<link rel='stylesheet' type='text/css' media='all' href='../userguide.css' />
9
admin17a890d2006-09-27 20:42:42 +0000[diff] [blame]10<script type="text/javascript" src="../nav/nav.js"></script>
admin2296fc32006-09-27 21:07:02 +0000[diff] [blame]11<script type="text/javascript" src="../nav/prototype.lite.js"></script>
admin17a890d2006-09-27 20:42:42 +0000[diff] [blame]12<script type="text/javascript" src="../nav/moo.fx.js"></script>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]13<script type="text/javascript">
14window.onload = function() {
admine334c472006-10-21 19:44:22 +0000[diff] [blame]15 myHeight = new fx.Height('nav', {duration: 400});
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]16 myHeight.hide();
17}
18</script>
19
20<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
21<meta http-equiv='expires' content='-1' />
22<meta http-equiv= 'pragma' content='no-cache' />
23<meta name='robots' content='all' />
24<meta name='author' content='Rick Ellis' />
25<meta name='description' content='Code Igniter User Guide' />
26
27</head>
28<body>
29
30<!-- START NAVIGATION -->
31<div id="nav"><div id="nav_inner"><script type="text/javascript">create_menu('../');</script></div></div>
32<div id="nav2"><a name="top"></a><a href="javascript:void(0);" onclick="myHeight.toggle();"><img src="../images/nav_toggle.jpg" width="153" height="44" border="0" title="Toggle Table of Contents" alt="Toggle Table of Contents" /></a></div>
33<div id="masthead">
34<table cellpadding="0" cellspacing="0" border="0" style="width:100%">
35<tr>
Derek Allardf743c732007-02-14 01:36:46 +0000[diff] [blame^]36<td><h1>Code Igniter User Guide Version 1.5.2</h1></td>
adminc0d5d522006-10-30 19:40:35 +0000[diff] [blame]37<td id="breadcrumb_right"><a href="../toc.html">Table of Contents Page</a></td>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]38</tr>
39</table>
40</div>
41<!-- END NAVIGATION -->
42
43
44<!-- START BREADCRUMB -->
45<table cellpadding="0" cellspacing="0" border="0" style="width:100%">
46<tr>
47<td id="breadcrumb">
48<a href="http://www.codeigniter.com/">Code Igniter Home</a> &nbsp;&#8250;&nbsp;
49<a href="../index.html">User Guide Home</a> &nbsp;&#8250;&nbsp;
50Form Helper
51</td>
52<td id="searchbox"><form method="get" action="http://www.google.com/search"><input type="hidden" name="as_sitesearch" id="as_sitesearch" value="www.codeigniter.com/user_guide/" />Search User Guide&nbsp; <input type="text" class="input" style="width:200px;" name="q" id="q" size="31" maxlength="255" value="" />&nbsp;<input type="submit" class="submit" name="sa" value="Go" /></form></td>
53</tr>
54</table>
55<!-- END BREADCRUMB -->
56
57<br clear="all" />
58
59
60<!-- START CONTENT -->
61<div id="content">
62
63
64<h1>Form Helper</h1>
65
66<p>The Form Helper file contains functions that assist in working with forms.</p>
67
68
69<h2>Loading this Helper</h2>
70
71<p>This helper is loaded using the following code:</p>
72<code>$this->load->helper('form');</code>
73
74<p>The following functions are available:</p>
75
76
77
78<h2>form_open()</h2>
79
80<p>Creates an opening form tag with a base URL <strong>built from your config preferences</strong>. It will optionally let you
81add form attributes and hidden input fields.</p>
82
83<p>The main benefit of using this tag rather than hard coding your own HTML is that it permits your site to be more portable
84in the event your URLs ever change.</p>
85
86<p>Here's a simple example:</p>
87
88<code>echo form_open('email/send');</code>
89
90<p>The above example would create a form that points to your base URL plus the "email/send" URI segments, like this:</p>
91
92<code>&lt;form method="post" action="http:/www.your-site.com/index.php/email/send" /></code>
93
94<h4>Adding Attributes</h4>
95
96<p>Attributes can be added by passing an associative array to the second parameter, like this:</p>
97
98<code>
99$attributes = array('class' => 'email', 'id' => 'myform');<br />
100<br />
101echo form_open('email/send', $attributes);</code>
102
103<p>The above example would create a form similar to this:</p>
104
105<code>&lt;form method="post" action="http:/www.your-site.com/index.php/email/send" &nbsp;class="email" &nbsp;id="myform" /></code>
106
107<h4>Adding Hidden Input Fields</h4>
108
109<p>Hidden fields can be added by passing an associative array to the third parameter, like this:</p>
110
111<code>
112$hidden = array('username' => 'Joe', 'member_id' => '234');<br />
113<br />
114echo form_open('email/send', '', $hidden);</code>
115
116<p>The above example would create a form similar to this:</p>
117
118<code>&lt;form method="post" action="http:/www.your-site.com/index.php/email/send" &nbsp;class="email" &nbsp;id="myform" /><br />
119&lt;input type="hidden" name="username" value="Joe" /><br />
120&lt;input type="hidden" name="member_id" value="234" /></code>
121
122
123<h2>form_open_multipart()</h2>
124
125<p>This function is absolutely identical to the <dfn>form_open()</dfn> tag above except that it adds a multipart attribute,
126which is necessary if you would like to use the form to upload files with.</p>
127
128<h2>form_hidden()</h2>
129
130<p>Lets you generate hidden input fields. You can either submit a name/value string to create one field:</p>
131
132<code>form_hidden('username', 'johndoe');<br />
133<br />
134// Would produce:<br /><br />
135&lt;input type="hidden" name="username" value="johnodoe" /></code>
136
137<p>Or you can submit an associative array to create multiple fields:</p>
138
139<code>$data = array(<br />
140&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'name'&nbsp;&nbsp;=> 'John Doe',<br />
141&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'email' => 'john@some-site.com',<br />
142&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'url'&nbsp;&nbsp;&nbsp;=> 'http://www.some-site.com'<br />
143&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;);<br />
144<br />
145echo form_hidden($data);<br />
146<br />
147// Would produce:<br /><br />
148&lt;input type="hidden" name="name" value="John Doe" /><br />
149&lt;input type="hidden" name="email" value="john@some-site.com" /><br />
150&lt;input type="hidden" name="url" value="http://www.some-site.com" /></code>
151
152
153
154
155<h2>form_input()</h2>
156
157<p>Lets you generate a standard text input field. You can minimally pass the field name and value in the first
158and second parameter:
159
160<code>echo form_input('username', 'johndoe');</code>
161
162<p>Or you can pass an associative array containing any data you wish your form to contain:</p>
163
164<code>$data = array(<br />
165&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'name'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> 'username',<br />
166&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'id'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> 'username',<br />
167&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'value'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> 'johndoe',<br />
168&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'maxlength'&nbsp;&nbsp;&nbsp;=> '100',<br />
169&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'size'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '50',<br />
170&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'style'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; => 'width:50%',<br />
171&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;);<br />
172<br />
173echo form_input($data);<br />
174<br />
175// Would produce:<br /><br />
176&lt;input type="text" name="username" id="username" value="johndoe" maxlength="100" size="50" style="width:50%" /></code>
177
admine334c472006-10-21 19:44:22 +0000[diff] [blame]178<p>If you would like your form to contain some additional data, like JavaScript, you can pass it as a string in the
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]179third parameter:
180
181<code>$js = 'onClick="some_function()"';<br />
182<br />
183echo form_input('username', 'johndoe', $js);</code>
184
185<h2>form_password()</h2>
186
admine334c472006-10-21 19:44:22 +0000[diff] [blame]187<p>This function is identical in all respects to the <dfn>form_input()</dfn> function above
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]188except that is sets it as a "password" type.</p>
189
190<h2>form_upload()</h2>
191
admine334c472006-10-21 19:44:22 +0000[diff] [blame]192<p>This function is identical in all respects to the <dfn>form_input()</dfn> function above
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]193except that is sets it as a "file" type, allowing it to be used to upload files.</p>
194
195<h2>form_textarea()</h2>
196
admine334c472006-10-21 19:44:22 +0000[diff] [blame]197<p>This function is identical in all respects to the <dfn>form_input()</dfn> function above
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]198except that it generates a "textarea" type. Note: Instead of the "maxlength" and "size" attributes in the above
199example, you will instead specify "rows" and "cols".</p>
200
201
202<h2>form_dropdown()</h2>
203
204<p>Lets you create a standard drop-down field. The first parameter will contain the name of the field,
205the second parameter will contain an associative array of options, and the third parameter will contain the
206value you wish to be selected. Example:
207
208<code>$options = array(<br />
209&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'small'&nbsp;&nbsp;=> 'Small Shirt',<br />
210&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'med'&nbsp;&nbsp;&nbsp;&nbsp;=> 'Medium Shirt',<br />
adminb071bb52006-08-26 19:28:37 +0000[diff] [blame]211&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'large'&nbsp;&nbsp; => 'Large Shirt',<br />
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]212&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'xlarge' => 'Extra Large Shirt',<br />
213&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;);<br />
214<br />
215echo form_dropdown('shirts', $options, 'large');<br />
216<br />
217// Would produce:<br /><br />
218
219&lt;select name="shirts"><br />
adminb071bb52006-08-26 19:28:37 +0000[diff] [blame]220&lt;option value="small">Small Shirt&lt;/option><br />
221&lt;option value="med">Medium Shirt&lt;/option><br />
222&lt;option value="large" selected>Large Shirt&lt;/option><br />
223&lt;option value="xlarge">Extra Large Shirt&lt;/option><br />
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]224&lt;/select></code>
225
226
admine334c472006-10-21 19:44:22 +0000[diff] [blame]227<p>If you would like the opening &lt;select> to contain additional data, like JavaScript, you can pass it as a string in the
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]228fourth parameter:
229
230<code>$js = 'onChange="some_function()"';<br />
231<br />
232echo form_dropdown('shirts', $options, 'large', $js);</code>
233
234
235<h2>form_checkbox()</h2>
236
237<p>Lets you generate a checkbox field. Simple example:
238
239
240<code>echo form_checkbox('newsletter', 'accept', TRUE);<br />
241<br />
242// Would produce:<br />
243<br />
244&lt;input type="checkbox" name="newsletter" value="accept" checked="checked" /></code>
245
246<p>The third parameter contains a boolean TRUE/FALSE to determine whether the box should be checked or not.</p>
247
248<p>Similar to the other form functions in this helper, you can also pass an array of attributes to the function:</p>
249
250<code>$data = array(<br />
251&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'name'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> 'newsletter',<br />
252&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'id'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> 'newsletter',<br />
253&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'value'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> 'accept',<br />
254&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'checked'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> TRUE,<br />
255&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'style'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; => 'margin:10px',<br />
256&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;);<br />
257<br />
258echo form_checkbox($data);<br />
259<br />
260// Would produce:<br /><br />
261&lt;input type="checkbox" name="newsletter" id="newsletter" value="accept" checked="checked" style="margin:10px" /></code>
262
admine334c472006-10-21 19:44:22 +0000[diff] [blame]263<p>As with other functions, if you would like the tag to contain additional data, like JavaScript, you can pass it as a string in the
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]264fourth parameter:
265
266<code>$js = 'onClick="some_function()"';<br />
267<br />
268echo echo form_checkbox('newsletter', 'accept', TRUE, $js)</code>
269
270
271<h2>form_radio()</h2>
272<p>This function is identical in all respects to the <dfn>form_checkbox()</dfn> function above except that is sets it as a "radio" type.</p>
273
274
275<h2>form_submit()</h2>
276
277<p>Lets you generate a standard submit button. Simple example:</p>
278
279<code>echo form_submit('mysubmit', 'Submit Post!');<br />
280<br />
281// Would produce:<br />
282<br />
283&lt;input type="submit" name="mysubmit" value="Submit Post!" /></code>
284
285<p>Similar to other functions, you can submit an associative array in the first parameter if you prefer to set your own attributes.
286The third parameter lets you add extra data to your form, like JavaScript.</p>
287
288
289<h2>form_close()</h2>
290
291<p>Produces a closing &lt;/form> tag. The only advantage to using this function is it permits you to pass data to it
292which will be added below the tag. For example:</p>
293
294<code>$string = "&lt;/div>&lt;/div>";<br />
295<br />
296echo form_close($string);<br />
297<br />
298// Would produce:<br />
299<br />
300&lt;/form><br />
301&lt;/div>&lt;/div></code>
302
303
304
305
306
307<h2>form_prep()</h2>
308
309<p>Allows you to safely use HTML and characters such as quotes within form elements without breaking out of the form. Consider this example:</p>
310
311<code>$string = 'Here is a string containing <strong>"quoted"</strong> text.';<br />
312<br />
313&lt;input type="text" name="myform" value="<var>$string</var>" /></code>
314
315<p>Since the above string contains a set of quotes it will cause the form to break.
316The form_prep function converts HTML so that it can be used safely:</p>
317
318<code>&lt;input type="text" name="myform" value="<var>&lt;?php echo form_prep($string); ?></var>" /></code>
319
320<p class="important"><strong>Note:</strong> If you use any of the form helper functions listed in this page the form
321values will be prepped automatically, so there is no need to call this function. Use it only if you are
322creating your own form elements.</p>
323
324
325
326
327</div>
328<!-- END CONTENT -->
329
330
331<div id="footer">
332<p>
333Previous Topic:&nbsp;&nbsp;<a href="file_helper.html">File Helper</a>
334&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
335<a href="#top">Top of Page</a>&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
336<a href="../index.html">User Guide Home</a>&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
337Next Topic:&nbsp;&nbsp;<a href="html_helper.html">HTML Helper</a>
338<p>
339<p><a href="http://www.codeigniter.com">Code Igniter</a> &nbsp;&middot;&nbsp; Copyright &#169; 2006 &nbsp;&middot;&nbsp; <a href="http://www.pmachine.com">pMachine, Inc.</a></p>
340</div>
341
342</body>
343</html>