Introduction to the problem that you will solve

It’s time to begin work on the BTI420 Programming Assignment.

You will create a new entity data model, and a page that will let you add new entity objects (and display the existing objects). The ability to add new objects is limited to you, as web site owner, in the “Administrator” role (as configured in ASP.NET Membership).

If you are NOT logged in, you will see something similar to this when you visit the page:

.

After you login, you will see an image similar to the one below. Notice that the Login control is replaced, and we have the ability to add a new blog post. (Note – only an “Administrator” is able to add a blog post, so you will see this only on your own web site.)

.

Specifications

Configure ASP.NET Membership and Roles, by following the procedure we covered during the Week 6 lectures/classes.

Create these roles – use these exact names:

Administrator

Author

Member

.

Add yourself as a user. The user name doesn’t matter. Make sure you place yourself in the role of “Administrator”.

.

Create an entity data model

Add an Entity Framework data model. Its Model (edmx) source code file name must be Lab5Model.edmx.

On the wizard’s “Choose Model Contents” dialog, select “Empty Model“. Later, we will generate the code that will add the data model’s tables to the database.

On the design surface, add an entity named “Lab5Post“. It must have the following properties:

PostID, which is a “key property” of type Int32

Title (String)

Author (String)

Content (String)

DateCreated (DateTime)

VisibilityStatus (String)

PublishStatus (String)

.

A reminder – watch the “Nullable” setting on your properties. If Nullable is “False”, then the code that you write later, which adds a new “Lab5Post” object, MUST provide valid data for the property.

If you wish, you can add the other typical blog post properties that we introduced in the Friday February 18 lecture/class.

Note: You do NOT have to create the Category and DigitalContent entities for Lab 5.

When you are happy with your entity’s design, save your work. Note:

The model namespace will be called Lab5Model

The entity container will be called Lab5ModelContainer

.

Generate the code that will add to the database

Right-click an empty area of the design surface, and choose “Generate Database from Model”.

Fill in the “Choose Your Data Connection” dialog. You will probably have to create a new connection (and test your connection before continuing). Yes, include the sensitive data in the connection string.

The “Summary and Settings” dialog will show the generated data definition language (DDL) needed to add the data model’s tables to the database:

Right-click anywhere in the DDL text, choose Select All, and then right-click again, and choose Copy.

Then, paste into a new query window/panel in SQL Server Management Studio. There, you can execute the query, which will add (and/or replace) the database objects.

If you are working on a local file system based web site, then you can click the Finish button, and it will be saved in the App_Code folder. However, if you are connected directly to your warp-based web site, you can click the Cancel button.

.

Create your lab5.aspx page

Now that you have an entity data model, you can create your lab5.aspx page.

Re-use the “labs.master” master page, which you first created for the previous lab exercise.

Add lab5.aspx in your labs folder, and it will use your “labs.master” master page.

There will be three areas on the page:

The first area will have a LoginView control. In its AnonymousTemplate, there will be a Login control. In its LoggedInTemplate, there will be a LoginName control, and a LoginStatus control.

The second area will have a LoginView control. It will have a RoleGroups template, configured for the “Administrator” role. Inside this template, we will place a “blog editor” user control.

The third area will have a ListView control. It will display content from the Lab5Post entity.

.

Guidance on each of these areas is offered below.

.

Guidance for Lab 5

Use one of the textbooks and the MSDN documentation for how-to and reference information.

.

First area – login, and login status

As noted above, this first area will have a LoginView control. In its AnonymousTemplate, there will be a Login control. In its LoggedInTemplate, there will be a LoginName control, and a LoginStatus control.

Adding the Login control is uncomplicated.

Adding the LoginName control is uncomplicated. We suggest that you use its FormatString property to make it look like the professor’s Lab 5 example.

Adding the LoginStatus control is uncomplicated. We suggest that you set its LoginText string to an empty string.

.

Second area – blog post entry

Create a new user control, probably called BlogEditorVersion1.ascx, and add it in the usual place (/ui/uc).

This user control will provide functionality similar to the “…Blog V1 Post” code example from last week. We are creating a user control so that we can “modularize” the blog editing function. You could then use it on any page. Later in the course, you will create another blog editing user control, which will enable rich text editing.

As noted above, this second area will have a LoginView control. It will have only a RoleGroups template, configured for the “Administrator” role. This means that it will only display content if an “Administrator” is logged in (and nothing otherwise).

Inside the RoleGroups template, we will place the “blog editor” user control. If you are working in markup/code view, it’s straightforward. However, if you are working in design view, then you may need this help. First, select the LoginView control, and open the SmartTasks panel.

Choose Edit RoleGroups…, and add your Administrator role.

Then, select the new template/view, as shown below:

.

Design view will show you a small box, which is where you click-drag-and-drop your user control into. See the image below – drag the user control into the rectangle, as suggested by the red arrow.

Incidentally, after your code adds a new blog post entity object, it will not immediately show up on the ListView in the third area of the page. This is because of the page’s processing sequence. There are two easy ways to address this: 1) In the user control, after adding the object, response-redirect to reload the page; or 2) add a “refresh” button to the third area (below).

.

Third area – blog post display

As noted above, this third area will have a ListView control. It will display content from the Lab5Post entity, for ALL users of the page.

For this Lab 5, you can perform a simple and uncomplicated ListView configuration. Later, for your assignment, you can customize the ListView to improve its appearance.

Add a ListView control. We suggest that you choose the “Flow” layout option. If you leave all other settings at their defaults, the ListView will display your blog posts.

.

Submitting your work

Update your web site home page to add a link to this lab.

When you do a lab exercise, you are creating it online on the warp server. Therefore, you do NOT have to submit paperwork to your professor. Just do the lab, and your professor will find it (as long as it is in the right location!).