This is the solution to the ChallengeEpicSpiesAssetTracker, where you are tasked with creating a system for Epic Spies, inc. that keeps track of all their assets’ statistics. This was a tricky challenge, because we haven’t touched on the exact method to use in order to complete it, but it’s ultimately a combination of array-based functionality we’ve used up to this point. Read on only as much as you need in order to get past the issue you’re facing, then try and solve the rest on your own if possible.
Step 1: Default.aspx Page
To begin, create a new ASP.NET Web Forms Project and set up the Default.aspx Page as we’ve done throughout this series. Then, switch to the design view and add the following controls to your web form:
The programmatic IDs for the controls are as follows:
- assetTextBox
- electionsTextBox
- actsTextBox
- addButton
- resultLabel
The Epic Spies logo should be only 150px tall. To set the size, move your cursor over the bottom right-hand corner of the image, click and drag to resize the image:
Step 2: Creating the Arrays
Next, double-click the addButton to open the addButton_Click event in Default.aspx.cs. What we need to do first is create a set of arrays to hold the different values that the user inputs into the TextBoxes. We also know that we need to retain their values between post backs to the server, so we need to initialize these arrays in the Page_Load event:
Now that we have our arrays initialized, we need to add them to the ViewState so that we can save them between posts back to the server:
Tip:
Adding objects to the ViewState requires that a key is assigned so that we can access those objects by referencing that key. In this case, the key is the upper-case version of the array we’re adding to ViewState. Not only is this easier to remember, but it’s easier to read for others looking at your code later.
Now that we have these arrays initialized and added to the ViewState, we’re almost ready to begin adding items to them. However, we need to wrap the Page_Load code in a conditional to ensure that we don’t initialize these values over and over:
Step 3: Retrieving Arrays from ViewState
Next, we need to retrieve the arrays’ values from the ViewState so that we can modify them in the addButton_Click. We can do this by creating locally-scoped arrays that take on the value of their counterparts held in ViewState. For instance, we create a new string array called assets that holds the ViewState["Assets"] value. We do this for all three arrays:
Tip:
The values in ViewState are generic objects, which cannot be implicitly converted to arrays, nor will a helper method such as ToString() work. We need to cast them not only to the appropriate data type, but to an array of that data type. Failing to cast like this results in the following error:
Step 4: Resizing the Arrays
Now that we’ve retrieved the arrays we created, we need to resize them before adding the information the user input. In order to do this, use the Array.Resize() method, which takes in two parameters:
- An array reference
- The new length
Obviously, the array reference will be the array you’re trying to resize, such as assets or elections. But how do you determine the new length? In Lesson 23, we simply used myArray.Length + 1, but since we have multiple arrays, using this method for each creates a lot of redundant and unnecessary code. Because all three arrays will be the same length, what we can do is create an integer variable equal to one more than the length of one of the arrays:
Now that we know the length the new arrays need to be, we can proceed by using the Resize() method for each array:
Step 5: Adding Values to the Arrays
Before we can begin to add values to the arrays, we need to make sure that we add them at the appropriate location, in the newest index we just created. To do this, create a new int variable called newIndex that holds that value:
Note: Remember that the GetUpperBound() method takes in the dimension of the array that you’re evaluating. Because we’re dealing with single-dimension, zero-based arrays, this will be 0.
Now, we can add the user-input values to the arrays at the appropriate index. Make sure to use the int.Parse() method for the integer arrays:
Now that the arrays are updated, they need to be saved back to the ViewState to be preserved between post backs. To do this, simply assign the appropriate ViewState to the array:
Step 6: Formatting the resultLabel
The final step is to display the result to the resultLabel. In order to meet the requirements for the challenge, use the String.Format() method and type the following:
In order to retrieve the values needed, we can make use of the helper methods for the arrays. For {0}, we can use elections.Sum() to add all the integers stored in the elections array. For the average acts, we can use acts.Average(), and the last asset can be retrieved by simply using assets[newIndex]:
To correctly format the average to display two decimal places, postfix it with N2:
Finally, clear out the text from the TextBoxes before the page refreshes:
Save and run your project to see the result:
Conclusion
This completes the solution for ChallengeEpicSpiesAssetTracker. There was a lot required in order to complete this challenge, but hopefully you’re beginning to see how all you’ve learned so far about C# works together to create useful applications. Remember, repetition is key to learning, so keep on working with these concepts and practicing them. Hopefully you were able to complete most or all of this on your own. If not, that’s ok. Come back later and try it again. Great job!
