Linking items in a listbox to items in an array

Tutorial Summary

This tutorial shows you how to create two arrays; one stores names and the other stores ages. A listbox on the form is filled with the names from the array and the slots of the array that the names came from are stored using the listbox's itemData property.

 

When the user clicks on a name in the list, the itemData property (that stores the original array slot of the name in the list) is used to get the age of the selected person on the list.

Create a new project

Create a new project (Standard EXE).

Preparing the form

Click on the listbox icon in the Toolbox and draw out a listbox on the form.

Change the name property of the listbox to lstNames as it's going to list names.

If you haven't already done so, resize the form so that there's no wasted form space.

 

Create the global code

Double click on an empty area of the form (i.e. not on the listbox) to create the Form_Load event in the code editor.

When the code editor appears, the cursor will be inside the Form_Load sub-routine. Move the cursor up one line so that's it's just in front of Private Sub.

Press a few times to create some empty space above the Private Sub Form_Load line. Move your cursor up to the top, ready to enter the code below.

You are now in the (General) code area. This is where you should declare variables that are used by all of the sub-routines of your program (known as Global variables).

Enter the following code at the top of the empty space in the code editor:

The code that you've just entered creates two arrays, one called arrayNames, the other called arrayAges. Each of the arrays has five slots and is available to all the Sub-routines of the program because you've created them in the global declaration area of the code.

Create the Form_Load event code

Now that you've created the two arrays, you need to fill them with names and ages when the program runs. The Form_Load event is triggered when the program is loaded but just before the form is shown to the user for them to use.

This makes the Form_Load event the perfect place to initialise your data (e.g. putting data into arrays).

Move the cursor back into the Form_Load event code. The code that you type here will only ever be run once during the program - when it starts.

The variable for the For...Next loop

The first line of code will create a variable that will be used in a For...Next loop further down in the code. Type this code into the Form_Load event:

Putting values into the ages array

The next several lines of code put an age into each slot of arrayAges. Type this code after the code above:

Putting names into the names array

The next section of code stores a name in each slot of arrayNames. Type this code after the code above:

Adding the names from arrayNames to the listbox

The next block of code uses a For...Next loop to go through each slot of the names array and add each name to the listbox on your form. Add this code:

Storing the array slot number for each item in the listbox to the listbox's itemData property

Because your program needs to know which age belongs to which person in the listbox when the user selects a name you need to store the array slot of arrayNames that the person came from.

Fortunately, as well as the list property that stores the names in your list, there is also an itemData property that allows you to store an integer related to each slot in the list.

The integer that you need to store is the array slot number of the name (so that you can look up their age in the ages array). This next piece of code is a For...Next loop that loops through the items in the listbox and sets the itemData value of each list item to the array slot number of the name.

Create the Click event code for the list

On your form, double-click on the listbox. This will add the empty sub-routine for the list's Click event. This event is triggered whenever the user clicks on an item in the list.

The text cursor should already be inside the sub-routine. If it isn't (e.g. you've clicked somewhere else) then just double-click the listbox on your form again.

Declaring the variables used in Private Sub lstNames_Click

The first section of code creates the variables that will be used in the event. 

• iSelectedItem will store the item number of the list that was clicked.
• iItemData will store the itemData value associated with the selected item.
• iAge will store the age retrieved from the ages array using iItemData as the slot in the array.

The next section of code finds out what the currently selected item in the listbox is by looking at the listbox's ListIndex property. The selected item is then stored in the iSelectedItem variable.

The next item of code used the value that was just stored in iSelectedItem (in other words, the currently selected item in the list) to get the itemData value associated with the selected list item. Remember - the value stored in the itemData property is the slot number in the names and ages arrays that the item is associated with. This value is then stored in the iItemData variable.
  

The next piece of code uses the slot number that was stored in the itemData property to get the age of the selected person from the ages array. The age is then stored in the iAge variable.
  

The age stored in iAge can be turned into a string and shown in a message box using the final piece of code:

That's it - run your program! :)

You've now completed the program so all that remains is to try running your program and clicking on some names. A message box should be displayed showing the age of the person that you selected.

Here's some answers to questions you might have:

Q: Help! What's wrong with your code? My program doesn't work.

A: My code works. Trust me. I've tested it. When the error box pops up, click on the Debug button and see which code is marked with the yellow highlight. Compare it to the code in the complete listing below. It's very easy to make a spelling or typing mistake.

Why not use the itemData property to store the age instead of the array slot?

A: There's no reason why you shouldn't but - itemData can only store integers. It can't store text. Imagine if the ages array was an address array instead - you couldn't store the person's address in itemData but you could store it in an array of strings... and use itemData to store the slot number of the person's address.

Q: The list isn't in alphabetical order. I want the names listed alphabetically.

A: This can be done but it's a little harder to do. I'll address this in another tutorial soon.

 

---

Complete code listing

 

 

All design & content ©2008 Phil Emerson