[SOLVED] html SQL database Go Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)

element and let intelliSense help you update the fields. IntelliSense works with Tag Helpers.
6. Add the Rating field to the Edit Page.
7. The app wont work until the DB is updated to include the new field. If run now,
the app throws a SqlException.
There are a few approaches to resolving the error:
i. Have the Entity Framework automatically drop and re-create the database using the new model class schema. This approach is convenient early in the development cycle; it allows you to quickly evolve the model and database schema together. The downside is that you lose existing data in the database. You dont want to use this approach on a production database! Dropping the DB on schema changes and using an initializer to automatically seed the database with test data is often a productive way to develop an app.
ii. Explicitly modify the schema of the existing database so that it matches the model classes. The advantage of this approach is that you keep your data. You can make this change either manually or by creating a database change script.
iii. Use Code First Migrations to update the database schema.
Level 3
Asia Pacific University of Technology & Innovation Page 12 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
8. In this tutorial, use Code First Migrations. Update the SeedData class so that it provides a value for the new column. A sample change is shown below, but youll want to make this change for each new Flower block.
9. Build the solution.
10. From the Tools menu, select NuGet Package Manager > Package Manager
Console. In the PMC, enter the following commands:
Add-Migration Rating Update-Database
The Add-Migration command tells the framework to:
Compare the Flower model with the Flower DB schema.
Create code to migrate the DB schema to the new model.
The name Rating is arbitrary and is used to name the migration file. Its helpful to use a meaningful name for the migration file.
Level 3
Asia Pacific University of Technology & Innovation Page 13 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
11. If you delete all the records in the DB, the initializer will seed the DB and include the Rating field. You can do this with the delete links in the browser or from Sql Server Object Explorer (SSOX). To delete the database from SSOX:
12. Run the app and verify you can create/edit/display flowers with a Rating field. If the database isnt seeded, stop IIS Express, and then run the app.
Select the database in SSOX.
Right click on the database, and select Delete.
Check Close existing connections.
Select OK.
In the PMC, update the database by typing: Update-Database
Level 3
Asia Pacific University of Technology & Innovation Page 14 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
d. Add validation to an ASP.NET Core Razor Page.
Estimation time for this section D: 10 Minutes
In this section, validation logic is added to the Flower model. The validation rules are
enforced any time a user creates or edits a flower.
1. Now, adding validation rules to the flower model.
2. Open the Models/Flower.cs file. DataAnnotations provides a built-in set of validation attributes that are applied declaratively to a class or property.
DataAnnotations also contains formatting attributes like DataType that help with
formatting and dont provide validation.
3. Update the class to take advantage of the Required, StringLength,
, and Range validation attributes.
Flower
RegularExpression
public class Flower
{
public int ID { get; set; }
[StringLength(60, MinimumLength = 3)]
[Required]
[Display(Name = Flower Name)]
public string FlowerName { get; set; }
[Display(Name = Flower Produced Date)]
[DataType(DataType.Date)]
public DateTime FlowerProducedDate { get; set; }
[RegularExpression(@^[A-Z]+[a-zA-Zs-]*$)]
[Required]
[StringLength(30)]
public string Type {get; set; }
[Range(1, 100)]
[DataType(DataType.Currency)]
[Column(TypeName = decimal(18, 2))]
public decimal Price { get; set; }
[Range(1, 10)]
[StringLength(5)]
[Required]
}
public string Rating { get; set; }
Level 3
Asia Pacific University of Technology & Innovation Page 15 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
Notes:
Validation attributes specify behavior thats enforced on model properties:
The Required and MinimumLength attributes indicate that a property must have a value. However, nothing prevents a user from entering whitespace to satisfy the validation constraint for a nullable type. Non-nullable value types (such as decimal, int, float, and DateTime) are inherently required and dont need the Required attribute.
The RegularExpression attribute limits the characters that the user can enter. In the preceding code, Genre must start with one or more capital letters and follow with zero or more letters, single or double quotes, whitespace characters, or dashes. Rating must start with one or more capital letters and follow with zero or more letters, numbers, single or double quotes, whitespace characters, or dashes.
The Range attribute constrains a value to a specified range.
The StringLength attribute sets the maximum length of a string, and optionally the minimum length.
Level 3 Asia Pacific University of Technology & Innovation Page 16 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
e. Deploy the web application together with the Local SQL database to the Azure Cloud.
Estimation time for this section E: 20 Minutes
In this section, we will publish our web application with the database to the Azure
Cloud environment.
Follow the below steps:
1. Go to the solution explorer and right click on the MVCFlowerShop. Choose
the publish button.
2. Click start and reach to the Pick a Publish Target dialog box. Choose the App
. Select the Create New under the Azure App Service. Then, choose
the and click on it.
3. When reach to the Create App Service dialog box, fill up the below information:
Service
Create Profile
Enter your subscription.
The App Name, Subscription, and Resource Group entry fields are populated.
You can keep these names or change them.
In the Hosting Plan, kindly choose the New button.
At the form of Configure Hosting Plan, choose the location as Southeast Asia
and the size as free.
Level 3
Asia Pacific University of Technology & Innovation Page 17 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
Then, at the Explore Additional Azure Services, select Create a SQL Database to create a new database.
Select New on the Configure SQL Database dialog to create a new database.
Select the Southeast Asia as your SQL DB Location.
Then, create your admin username and password in the given columns.
Level 3 Asia Pacific University of Technology & Innovation Page 18 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
4. Then, a column of Connection String Name appear. Continue with the DefaultConnection string and press OK. And, return to the App Service dialog box.
Level 3 Asia Pacific University of Technology & Innovation Page 19 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
create
5. 6.
Lastly, click on the button to start the deployment steps.
Once the deployment stage finish, it will be return to the publish page below:
Level 3
Asia Pacific University of Technology & Innovation Page 20 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
7.
Now, click on the configure button, and do the below configuration for the
database setting. Go to the Settings section and in the database section, check the below options:
Lastly, save the settings and click the publish button to publish your application to the Azure Cloud.
Level 3
Asia Pacific University of Technology & Innovation Page 21 of 26
8.

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
9. At the end, you will see your application is running in the azure cloud there, as below:
10. Now, go to your azure portal and change the settings for your Azure SQL server pricing tier plan as below. Choose the Basic plan.
Level 3 Asia Pacific University of Technology & Innovation Page 22 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
11. To access your database you can use the SQL Server Object Explorer (SSOX) or Microsoft SQL Management Studio to manage your database as what you learn in the previous exercises.
E.g. in SSOX :
Level 3
Asia Pacific University of Technology & Innovation Page 23 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
Level 3 Asia Pacific University of Technology & Innovation Page 24 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
E.g. in Microsoft SQL Management Studio
Level 3 Asia Pacific University of Technology & Innovation Page 25 of 26

Design and Developing Application in Cloud (CT071-3-5-3-DDAC) Get started with ASP.NET Core and Visual Studio (Part 2)
Summary:
In this tutorial, we learned how to build modify and update the generated pages. We also learned how to add the search bar in the page and also how to do the validation for the page.
Level 3 Asia Pacific University of Technology & Innovation Page 26 of 26