| author | Eugene Ostroukhov <eugeneo@symbian.org> |
| Thu, 15 Jul 2010 10:08:51 -0700 | |
| changeset 450 | ed815e0eef9a |
| parent 229 | 716254ccbcc0 |
| permissions | -rw-r--r-- |
|
229
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
1 |
|
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
2 |
<!DOCTYPE html |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
3 |
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
4 |
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><meta name="copyright" content="(C) Copyright 2009"/><meta name="DC.rights.owner" content="(C) Copyright 2009"/><meta name="DC.Type" content="concept"/><meta name="DC.Title" content="Handling selection lists"/><meta name="abstract" content="Lists are a basic UI component for displaying all kinds of information, actions, and navigation structures. Editing and organizing information in lists can be made easier by using markable lists. Different line layouts offer flexibility in presenting information; lines can contain different sizes of images and text to suit design needs."/><meta name="description" content="Lists are a basic UI component for displaying all kinds of information, actions, and navigation structures. Editing and organizing information in lists can be made easier by using markable lists. Different line layouts offer flexibility in presenting information; lines can contain different sizes of images and text to suit design needs."/><meta name="DC.Relation" scheme="URI" content="GUID-63F9FB97-9A0D-4DE4-A645-F3DB7DC39716"/><meta name="DC.Relation" scheme="URI" content="GUID-1666F263-F1CB-4928-B2A7-E518B43983BA"/><meta name="DC.Relation" scheme="URI" content="GUID-D54DEFE7-E878-4530-B707-A5388DFE1D9D"/><meta name="DC.Relation" scheme="URI" content="GUID-6DD2B3D2-BA3B-4936-BBC9-F61B6757B6F8"/><meta name="DC.Relation" scheme="URI" content="GUID-13E2DE63-47E5-4E2A-85FF-C8B0CAB9D4DE"/><meta name="DC.Format" content="XHTML"/><meta name="DC.Identifier" content="GUID-0EFEA51B-F98B-4C0B-9960-5D6247355ACA"/><meta name="DC.Language" content="en"/><title>Handling selection lists </title><script type="text/javascript"> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
5 |
function initPage() {}
|
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
6 |
</script><link href="../PRODUCT_PLUGIN/book.css" rel="stylesheet" type="text/css"/><link href="css/s60/style.css" rel="stylesheet" type="text/css" media="all"/></head><body onload="initPage();"><div class="body"><div class="contentLeft prTxt"><h1 class="pageHeading" id="GUID-0EFEA51B-F98B-4C0B-9960-5D6247355ACA">Handling selection lists</h1><div><p>Lists are a basic UI component for displaying all kinds of information, actions, and navigation structures. Editing and organizing information in lists can be made easier by using markable lists. Different line layouts offer flexibility in presenting information; lines can contain different sizes of images and text to suit design needs.</p> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
7 |
<div><h3>Using HTML tags</h3><p>You can use HTML <code>select</code> tags or JavaScript to create selection lists.</p></div> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
8 |
<div><h3>To use list components</h3><p>Create an HTML <code>form</code> element that contains the <code>select</code> tag.</p><pre class="codeblock"><form action = ""> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
9 |
<select> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
10 |
<option value = "coffee">Coffee</option> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
11 |
<option value = "tea">Tea</option> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
12 |
<option value = "water">Water</option> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
13 |
</select> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
14 |
</form></pre></div> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
15 |
<div><h3>Using JavaScript to create selection lists</h3><p>Selection lists allow users to select from a list of options. You can use JavaScript to create selection lists. Specify options as an array of JavaScript objects, where each object represents one option. Each option object has two properties: value and text. The value property can be any JavaScript value, including object references and is used to represent the concrete value of the option. The text property is used to display the option in the user interface. The value could for example be a boolean <code>true</code> or <code>false</code> while the text could be <span class="uicontrol">Yes</span> or <span class="uicontrol">No</span>.</p><p>The set of currently selected options can be set or retrieved from a selection control using <code>getter</code> and <code>setter</code> methods. For single selection controls the selected option is specified as a single reference to one of the options in the control. For multiple selection the selected options are specified as an array of references to zero or more of the options in the control. Refer to the instances of the options in the control; not other instances even if they are identical in value or text.</p><p>Selection controls fire <code>SelectionChanged</code> events when the user makes a selection in the control. </p><p>For an example of using JavaScript to create a selection list, see <a href="http://wiki.forum.nokia.com/index.php/CS000941_-_WRT_Listbox_Widget" target="_blank">WRT Listbox Widget</a>.</p></div> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
16 |
<div><h3>To create an array of JavaScript objects</h3><p>For multiple selection, specify an array of references to the options in the control.</p><pre class="codeblock">// create an array with three options |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
17 |
var options = [ |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
18 |
{ value: 1, text: "Coffee" },
|
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
19 |
{ value: 2, text: "Tea" },
|
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
20 |
{ value: 3, text: "Water" }
|
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
21 |
]; |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
22 |
</pre></div> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
23 |
<div><h3>Using lists in touch devices</h3><p>Use lists with single-line items and large graphics on touch devices. For more information about touch-specific issues, see <a href="http://library.forum.nokia.com/topic/Design_and_User_Experience_Library/GUID-6E5CEE22-7804-4848-9513-F0EFC3130EB0.html" target="_blank">Touch-specific issues in lists</a>.</p></div> |
|
716254ccbcc0
Fixed 2046: WRTKit help topics. Fixed 2170: Added support for Web Developer Library. Fixed 1952: Event Trigger icons unreadable
tasneems@symbian.org
parents:
diff
changeset
|
24 |
</div></div></div><div class="footer"><hr/><div class="copy">© Nokia 2009.</div></div></body></html> |