17
MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

Embed Size (px)

Citation preview

Page 1: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

MIS 3200 – Unit 4.2

• ListItem controls– CheckBoxList– ListBox

Page 2: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

An Index is a Position Number

• This device holds up to 300 CD’s• An individual CD is found by its

location, or position, in the device– Location/position is the number

of the slot where the CD is found– This number is an index

• The CD player has – properties (width, height, display, etc) and– methods (play a CD, move to another CD, etc)

This is a 100 DVD video disk player

Page 3: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

More ASP.NET Controls

• ASP.NET Controls that hold other controls may allow the user to select one or more options at a time

– CheckBoxList

• Shows each item with a checkbox• The user may select any number of items• May be formatted several different ways as shown here

Page 4: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

More Controls

ListBox (basically the same as a CheckBoxList)– Displays items in a box (instead of checkboxes)– Box size and the existence of a scroll bar are

controlled by the designer (the only difference)– Consecutive items selected by clicking on the first

item and shift-clicking on the second– Non-consecutive items selected by clicking on the

first item and then control-clicking on the others (control+command buttons on a Mac)

Page 5: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

CheckBoxList & ListBox

• Each item in these Controls is represented by a ListItem. Each ListItem has a– Value– Text

• ListItems can be created and edited from the Controls properties or its smart menu

Page 6: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

ListItem Collection EditorThis Editor allows you to 1. Add or Remove items2. Change the order of items3. Enter/Edit the Text

and Value of the item4. Pre-select an item

by setting Selected to True

1

23

4

Page 7: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

ListItem Collection

ListItems is a Collection -- a group of related things• You can find a specific item in the Collection using an Index

– The first item in the Collection has an index value of zero, – the second one is one, – the third is two, etc. (this is called zero-based addressing)

• The ListItem collection is called Items • and the index appears between [ ] like this

• cblMenu.Items[0] • // this is the first item in the collection• clbMenu.Items[intMyCounter] • // this uses a variable, intMyCounter, to indicate the item

Page 8: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

ListItem Collection

Testing a condition for the 4th item in the CheckBoxList:if (cblMenu.Items[3].Selected) //is the 4th checkbox selected?

{ //the 4th checkbox has an index of 3, since the first checkbox starts at 0 //this would make “.Selected” to TruelblText.Text = cblMenu.Items[3].Text; // would be CheeseburgerlblValue.Text = cblMenu.Items[3].Value; // would be ?

}

Given the following ListItems in a CheckBoxList (cblMenu):

Assume that the Value assigned to each Text item has a price in dollars increasing by 1 starting with Green Salad for 1 and ending with Diet Pepsi at 8

Page 9: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

ListItem Collection

To reset (un-check) all of the checked boxes:

• cblMenu.SelectedIndex = -1;

Page 10: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

Unit 4 L2.2

• In this exercise you will repeat the Unit 4.1 L2 and add a CheckBoxList

• You can do this exercise using the same page you created for your L1 & L2

• To make sure things will work properly here, make sure – the L1 validators and button are in a ValidationGroup of L1, – the L2 validators and button are in a ValidationGroup set to L2, – and the L2.2 validators and button are in a ValidationGroup set

to L2.2

Page 11: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

L2.2 #2

1. Create a new paragraph after L1 output label2. Grab a Horizontal Rule from the HTML tab of the toolbox

and drop it in the new paragraph3. Create a new paragraph, type CheckBoxList and make it

an H3 heading4. Below the heading create a line that looks identical to the

Total Sales line from L1 but with different names for the text box and the validators

5. Below that line type State of Residence

Page 12: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

L2.2 #3

6. Drag a RadioButtonList from the Standard tab of the toolbox and drop it after the word Residence• A RadioButtonList provides a set of mutually exclusive choices,

choices where only one thing can be true (use the SelectedValue property to get the value)

• Name the RadioButtonList rblState2• Change its RepeatDirection to Horizontal• Change its RepeatLayout to Flow• Click on Items and open the ListItemCollection Editor• Add five items (same as your L2)

– The first should have Text and Value = OH– The second should have Text and Value = WV– The remaining items should be PA, KY and IN

Page 13: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

L2.2 #4

7. Add a button below the state list• Give it an appropriate name• Change its Text to Calculate sales tax and total

8. Add a label named lblOutputCheckBoxList below the button9. Double click on the button to create a method10. Copy the code for your existing L2 Calculate button method

into this new method (update code to reference L22 controls)

11. Add appropriate comments to the method (these first 11 steps are just like your L2)

12. Add a new paragraph below the RadioButtonList with the text: Check all fees that apply:

Page 14: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

L2.2 #5

12. Add a CheckBoxList with an appropriate name under this new paragraph with the following Text and Value properties set (see slides 5 & 6 for examples):

a. Value: 5.00 Text: Registration Fee

b. Value: 7.50 Text: Vehicle License Fee

c. Value: 12.50Text: Weight Fee

d. Value: 4.50Text: County/District Fees

e. Value: 10.00Text: Owner Responsibility Fee

(see http://cob.ohio.edu/mis3200/asppub - U4L22 for an example)

Page 15: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

L2.2 #5

12. Using an if statement, test each checkbox by using its index value (see slide 8 for an example). If the box is checked, add (accumulate) the Value of the checked item to a decimal variable to keep track of the sum of the fees. For example, something like this (but for each index, 0 through 4):

13. Add a new line with the text: Fees (after sales tax) to the output label that displays how much is owed for the fees and then add this to the total amount due (see Unit 4 L2.2)

Page 16: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

L2.2 #6

14. Cleanup: clear the textbox, reset the radiobuttonlist and checkboxlist, set the focus to the L2.2 textbox. Make sure you add a required field validator for the radiobuttonlist (they do not work for checkboxlists, so you do not need to add one for that control)

15. Add the link to the L2.2 on your MIS3200 page and submit your MIS Portfolio public URL

Page 17: MIS 3200 – Unit 4.2 ListItem controls – CheckBoxList – ListBox

Think About It!

• When would a CheckBoxList be more appropriate than a ListBox (or visa versa)?

• Do you foresee problems with processing a CheckBoxList (or ListBox) by using nothing more than an if statement?