From d86761aacd3c42c4cfd91c8dc283c03d3f6edd89 Mon Sep 17 00:00:00 2001 From: Bader Nasser Date: Wed, 20 Sep 2017 14:36:07 +0400 Subject: [PATCH] Run the {page => app} --- aspnetcore/data/ef-mvc/advanced.md | 4 ++-- aspnetcore/data/ef-mvc/complex-data-model.md | 8 ++++---- aspnetcore/data/ef-mvc/concurrency.md | 6 ++---- aspnetcore/data/ef-mvc/crud.md | 8 ++++---- aspnetcore/data/ef-mvc/inheritance.md | 2 +- aspnetcore/data/ef-mvc/read-related-data.md | 10 +++++----- aspnetcore/data/ef-mvc/sort-filter-page.md | 8 ++++---- aspnetcore/data/ef-mvc/update-related-data.md | 10 +++++----- 8 files changed, 27 insertions(+), 29 deletions(-) diff --git a/aspnetcore/data/ef-mvc/advanced.md b/aspnetcore/data/ef-mvc/advanced.md index 54ecfae22dce..04aa298fc99a 100644 --- a/aspnetcore/data/ef-mvc/advanced.md +++ b/aspnetcore/data/ef-mvc/advanced.md @@ -57,7 +57,7 @@ Add a using statement: [!code-csharp[Main](intro/samples/cu/Controllers/HomeController.cs?name=snippet_Usings2)] -Run the About page. It displays the same data it did before. +Run the app and go to the About page. It displays the same data it did before. ![About page](advanced/_static/about.png) @@ -105,7 +105,7 @@ Sometimes it's helpful to be able to see the actual SQL queries that are sent to Open *StudentsController.cs* and in the `Details` method set a breakpoint on the `if (student == null)` statement. -Run the application in debug mode, and go to the Details page for a student. +Run the app in debug mode, and go to the Details page for a student. Go to the **Output** window showing debug output, and you see the query: diff --git a/aspnetcore/data/ef-mvc/complex-data-model.md b/aspnetcore/data/ef-mvc/complex-data-model.md index 1a1f622b5dab..63abb1ba22b2 100644 --- a/aspnetcore/data/ef-mvc/complex-data-model.md +++ b/aspnetcore/data/ef-mvc/complex-data-model.md @@ -57,7 +57,7 @@ You can use the `DisplayFormat` attribute by itself, but it's generally a good i For more information, see the [\ tag helper documentation](../../mvc/views/working-with-forms.md#the-input-tag-helper). -Run the Students Index page again and notice that times are no longer displayed for the enrollment dates. The same will be true for any view that uses the Student model. +Run the app, go to the Students Index page and notice that times are no longer displayed for the enrollment dates. The same will be true for any view that uses the Student model. ![Students index page showing dates without times](complex-data-model/_static/dates-no-times.png) @@ -93,7 +93,7 @@ The `migrations add` command warns that data loss may occur, because the change The timestamp prefixed to the migrations file name is used by Entity Framework to order the migrations. You can create multiple migrations before running the update-database command, and then all of the migrations are applied in the order in which they were created. -Run the Create page, and enter either name longer than 50 characters. When you click Create, client side validation shows an error message. +Run the app, select the **Students** tab, click **Create New**, and enter either name longer than 50 characters. When you click **Create**, client side validation shows an error message. ![Students index page showing string length errors](complex-data-model/_static/string-length-errors.png) @@ -479,11 +479,11 @@ dotnet ef database update Run the app to cause the `DbInitializer.Initialize` method to run and populate the new database. -Open the database in SSOX as you did earlier, and expand the **Tables** node to see that all of the tables have been created. (If you still have SSOX open from the earlier time, click the Refresh button.) +Open the database in SSOX as you did earlier, and expand the **Tables** node to see that all of the tables have been created. (If you still have SSOX open from the earlier time, click the **Refresh** button.) ![Tables in SSOX](complex-data-model/_static/ssox-tables.png) -Run the application to trigger the initializer code that seeds the database. +Run the app to trigger the initializer code that seeds the database. Right-click the **CourseAssignment** table and select **View Data** to verify that it has data in it. diff --git a/aspnetcore/data/ef-mvc/concurrency.md b/aspnetcore/data/ef-mvc/concurrency.md index 0e49b8b767b6..965bd5f16a72 100644 --- a/aspnetcore/data/ef-mvc/concurrency.md +++ b/aspnetcore/data/ef-mvc/concurrency.md @@ -180,9 +180,7 @@ In *Views/Departments/Edit.cshtml*, make the following changes: ## Test concurrency conflicts in the Edit page -Run the site and click Departments to go to the Departments Index page. - -Right-click the **Edit** hyperlink for the English department and select **Open in new tab**, then click the **Edit** hyperlink for the English department. The two browser tabs now display the same information. +Run the app and go to the Departments Index page. Right-click the **Edit** hyperlink for the English department and select **Open in new tab**, then click the **Edit** hyperlink for the English department. The two browser tabs now display the same information. Change a field in the first browser tab and click **Save**. @@ -251,7 +249,7 @@ This makes the following changes: * Adds a hidden field for the `RowVersion` property. -Run the Departments Index page. Right click the **Delete** hyperlink for the English department and select **Open in new tab**, then in the first tab click the **Edit** hyperlink for the English department. +Run the app and go to the Departments Index page. Right-click the **Delete** hyperlink for the English department and select **Open in new tab**, then in the first tab click the **Edit** hyperlink for the English department. In the first window, change one of the values, and click **Save**: diff --git a/aspnetcore/data/ef-mvc/crud.md b/aspnetcore/data/ef-mvc/crud.md index 6fdb5e6159ce..b268f9a3597c 100644 --- a/aspnetcore/data/ef-mvc/crud.md +++ b/aspnetcore/data/ef-mvc/crud.md @@ -103,7 +103,7 @@ If code indentation is wrong after you paste the code, press CTRL-K-D to correct This code loops through the entities in the `Enrollments` navigation property. For each enrollment, it displays the course title and the grade. The course title is retrieved from the Course entity that's stored in the `Course` navigation property of the Enrollments entity. -Run the application, select the **Students** tab, and click the **Details** link for a student. You see the list of courses and grades for the selected student: +Run the app, select the **Students** tab, and click the **Details** link for a student. You see the list of courses and grades for the selected student: ![Student Details page](crud/_static/student-details.png) @@ -151,7 +151,7 @@ An alternative way to prevent overposting that is preferred by many developers i The code in *Views/Students/Create.cshtml* uses `label`, `input`, and `span` (for validation messages) tag helpers for each field. -Run the page by selecting the **Students** tab and clicking **Create New**. +Run the app, select the **Students** tab, and click **Create New**. Enter names and a date. Try entering an invalid date if your browser lets you do that. (Some browsers force you to use a date picker.) Then click **Create** to see the error message. @@ -217,7 +217,7 @@ If you want to avoid the read-first approach, but you also want the SQL UPDATE s ### Test the Edit page -Run the application and select the **Students** tab, then click an **Edit** hyperlink. +Run the app, select the **Students** tab, then click an **Edit** hyperlink. ![Students edit page](crud/_static/student-edit.png) @@ -259,7 +259,7 @@ In *Views/Student/Delete.cshtml*, add an error message between the h2 heading an [!code-html[](intro/samples/cu/Views/Students/Delete.cshtml?range=7-9&highlight=2)] -Run the page by selecting the **Students** tab and clicking a **Delete** hyperlink: +Run the app, select the **Students** tab, and click a **Delete** hyperlink: ![Delete confirmation page](crud/_static/student-delete.png) diff --git a/aspnetcore/data/ef-mvc/inheritance.md b/aspnetcore/data/ef-mvc/inheritance.md index 9b93a81b6c10..c712f460deb3 100644 --- a/aspnetcore/data/ef-mvc/inheritance.md +++ b/aspnetcore/data/ef-mvc/inheritance.md @@ -127,7 +127,7 @@ dotnet ef database update ## Test with inheritance implemented -Run the site and try various pages. Everything works the same as it did before. +Run the app and try various pages. Everything works the same as it did before. In **SQL Server Object Explorer**, expand **Data Connections/SchoolContext** and then **Tables**, and you see that the Student and Instructor tables have been replaced by a Person table. Open the Person table designer and you see that it has all of the columns that used to be in the Student and Instructor tables. diff --git a/aspnetcore/data/ef-mvc/read-related-data.md b/aspnetcore/data/ef-mvc/read-related-data.md index e51f6a7a7c64..84a29ef625c4 100644 --- a/aspnetcore/data/ef-mvc/read-related-data.md +++ b/aspnetcore/data/ef-mvc/read-related-data.md @@ -81,7 +81,7 @@ You've made the following changes to the scaffolded code: @Html.DisplayFor(modelItem => item.Department.Name) ``` -Run the page (select the Courses tab on the Contoso University home page) to see the list with department names. +Run the app and select the **Courses** tab to see the list with department names. ![Courses Index page](read-related-data/_static/courses-index.png) @@ -199,7 +199,7 @@ You've made the following changes to the existing code: Select | ``` -Run the application and select the Instructors tab. The page displays the Location property of related OfficeAssignment entities and an empty table cell when there's no related OfficeAssignment entity. +Run the app and select the **Instructors** tab. The page displays the Location property of related OfficeAssignment entities and an empty table cell when there's no related OfficeAssignment entity. ![Instructors Index page nothing selected](read-related-data/_static/instructors-index-no-selection.png) @@ -209,7 +209,7 @@ In the *Views/Instructors/Index.cshtml* file, after the closing table element (a This code reads the `Courses` property of the view model to display a list of courses. It also provides a **Select** hyperlink that sends the ID of the selected course to the `Index` action method. -Run the page and select an instructor. Now you see a grid that displays courses assigned to the selected instructor, and for each course you see the name of the assigned department. +Refresh the page and select an instructor. Now you see a grid that displays courses assigned to the selected instructor, and for each course you see the name of the assigned department. ![Instructors Index page instructor selected](read-related-data/_static/instructors-index-instructor-selected.png) @@ -219,7 +219,7 @@ After the code block you just added, add the following code. This displays a lis This code reads the Enrollments property of the view model in order to display a list of students enrolled in the course. -Run the page and select an instructor. Then select a course to see the list of enrolled students and their grades. +Refresh the page again and select an instructor. Then select a course to see the list of enrolled students and their grades. ![Instructors Index page instructor and course selected](read-related-data/_static/instructors-index.png) @@ -233,7 +233,7 @@ Suppose you expected users to only rarely want to see enrollments in a selected The new code drops the *ThenInclude* method calls for enrollment data from the code that retrieves instructor entities. If an instructor and course are selected, the highlighted code retrieves Enrollment entities for the selected course, and Student entities for each Enrollment. -Run the Instructor Index page now and you'll see no difference in what's displayed on the page, although you've changed how the data is retrieved. +Run the app, go to the Instructors Index page now and you'll see no difference in what's displayed on the page, although you've changed how the data is retrieved. ## Summary diff --git a/aspnetcore/data/ef-mvc/sort-filter-page.md b/aspnetcore/data/ef-mvc/sort-filter-page.md index f65ff30c8363..1cd7505d3000 100644 --- a/aspnetcore/data/ef-mvc/sort-filter-page.md +++ b/aspnetcore/data/ef-mvc/sort-filter-page.md @@ -64,7 +64,7 @@ Replace the code in *Views/Students/Index.cshtml*, with the following code to ad This code uses the information in `ViewData` properties to set up hyperlinks with the appropriate query string values. -Run the page and click the **Last Name** and **Enrollment Date** column headings to verify that sorting works. +Run the app, select the **Students** tab, and click the **Last Name** and **Enrollment Date** column headings to verify that sorting works. ![Students index page in name order](sort-filter-page/_static/name-order.png) @@ -93,7 +93,7 @@ In *Views/Student/Index.cshtml*, add the highlighted code immediately before the This code uses the `
` [tag helper](https://docs.microsoft.com/aspnet/core/mvc/views/tag-helpers/intro) to add the search text box and button. By default, the `` tag helper submits form data with a POST, which means that parameters are passed in the HTTP message body and not in the URL as query strings. When you specify HTTP GET, the form data is passed in the URL as query strings, which enables users to bookmark the URL. The W3C guidelines recommend that you should use GET when the action does not result in an update. -Run the page, enter a search string, and click Search to verify that filtering is working. +Run the app, select the **Students** tab, enter a search string, and click Search to verify that filtering is working. ![Students index page with filtering](sort-filter-page/_static/filtering.png) @@ -190,7 +190,7 @@ The paging buttons are displayed by tag helpers: ``` -Run the page. +Run the app and go to the Students page. ![Students index page with paging links](sort-filter-page/_static/paging.png) @@ -238,7 +238,7 @@ Replace the code in the *Views/Home/About.cshtml* file with the following code: [!code-html[](intro/samples/cu/Views/Home/About.cshtml)] -Run the app and click the **About** link. The count of students for each enrollment date is displayed in a table. +Run the app and go to the About page. The count of students for each enrollment date is displayed in a table. ![About page](sort-filter-page/_static/about.png) diff --git a/aspnetcore/data/ef-mvc/update-related-data.md b/aspnetcore/data/ef-mvc/update-related-data.md index 38fb1a5b6b34..35d093018632 100644 --- a/aspnetcore/data/ef-mvc/update-related-data.md +++ b/aspnetcore/data/ef-mvc/update-related-data.md @@ -87,13 +87,13 @@ In *Views/Courses/Details.cshtml*, make the same change that you just did for *D ### Test the Course pages -Run the **Create** page (display the Course Index page and click **Create New**) and enter data for a new course: +Run the app, select the **Courses** tab, click **Create New**, and enter data for a new course: ![Course Create page](update-related-data/_static/course-create.png) Click **Create**. The Courses Index page is displayed with the new course added to the list. The department name in the Index page list comes from the navigation property, showing that the relationship was established correctly. -Run the **Edit** page (click **Edit** on a course in the Course Index page ). +Click **Edit** on a course in the Courses Index page. ![Course Edit page](update-related-data/_static/course-edit.png) @@ -155,7 +155,7 @@ In *Views/Instructors/Edit.cshtml*, add a new field for editing the office locat [!code-html[Main](intro/samples/cu/Views/Instructors/Edit.cshtml?range=30-34)] -Run the page (select the **Instructors** tab and then click **Edit** on an instructor). Change the **Office Location** and click **Save**. +Run the app, select the **Instructors** tab, and then click **Edit** on an instructor. Change the **Office Location** and click **Save**. ![Instructor Edit page](update-related-data/_static/instructor-edit-office.png) @@ -223,7 +223,7 @@ This code creates an HTML table that has three columns. In each column is a chec When the check boxes are initially rendered, those that are for courses assigned to the instructor have checked attributes, which selects them (displays them checked). -Run the Instructor Index page, and click **Edit** on an instructor to see the **Edit** page. +Run the app, select the **Instructors** tab, and click **Edit** on an instructor to see the **Edit** page. ![Instructor Edit page with courses](update-related-data/_static/instructor-edit-courses.png) @@ -283,7 +283,7 @@ In *Views/Instructor/Create.cshtml*, add an office location text box and check b [!code-html[Main](intro/samples/cu/Views/Instructors/Create.cshtml?range=29-61)] -Test by running the **Create** page and adding an instructor. +Test by running the app and creating an instructor. ## Handling Transactions