Share via

Samouczek: generowanie widoków dla usługi EF Database First przy użyciu ASP.NET aplikacji MVC

  • Artykuł

Za pomocą szkieletu MVC, Entity Framework i ASP.NET można utworzyć aplikację internetową, która udostępnia interfejs istniejącej bazy danych. W tej serii samouczków pokazano, jak automatycznie generować kod, który umożliwia użytkownikom wyświetlanie, edytowanie, tworzenie i usuwanie danych znajdujących się w tabeli bazy danych. Wygenerowany kod odpowiada kolumnom w tabeli bazy danych.

Ten samouczek koncentruje się na używaniu ASP.NET tworzenia szkieletów w celu generowania kontrolerów i widoków.

W tym samouczku zostały wykonane następujące czynności:

  • Dodawanie szkieletu
  • Dodawanie linków do nowych widoków
  • Wyświetlanie widoków uczniów
  • Wyświetlanie widoków rejestracji

Wymaganie wstępne

Dodawanie szkieletu

Wszystko jest gotowe do wygenerowania kodu, który zapewni standardowe operacje danych dla klas modelu. Kod można dodać, dodając element szkieletu. Istnieje wiele opcji typu szkieletu, które można dodać; W tym samouczku szkielet będzie zawierać kontroler i widoki odpowiadające modelom Student i Enrollment utworzonym w poprzedniej sekcji.

Aby zachować spójność w projekcie, dodasz nowy kontroler do istniejącego folderu Kontrolery . Kliknij prawym przyciskiem myszy folder Kontrolery , a następnie wybierz pozycję Dodaj>nowy element szkieletowy.

Wybierz kontroler MVC 5 z widokami, używając opcji Entity Framework . Ta opcja spowoduje wygenerowanie kontrolera i widoków na potrzeby aktualizowania, usuwania, tworzenia i wyświetlania danych w modelu.

dodawanie kontrolera mvc

Wybierz pozycję Student (ContosoSite.Models) dla klasy modelu i wybierz nazwę ContosoUniversityDataEntities (ContosoSite.Models) dla klasy kontekstowej. Zachowaj nazwę kontrolera jako StudentsController.

Kliknij pozycję Dodaj.

Jeśli wystąpi błąd, może to być spowodowane tym, że nie utworzono projektu w poprzedniej sekcji. Jeśli tak, spróbuj utworzyć projekt, a następnie ponownie dodaj element szkieletowy.

Po zakończeniu procesu generowania kodu zobaczysz nowy kontroler i widoki w folderach Kontrolery i widoki> projektu.

Wykonaj te same kroki ponownie, ale dodaj szkielet dla klasy Enrollment . Po zakończeniu masz plik EnrollmentsController.cs i folder w obszarze Widoki o nazwie Enrollments z widokami Tworzenie, Usuwanie, Szczegóły, Edytowanie i Indeks.

Aby ułatwić przejście do nowych widoków, możesz dodać kilka hiperlinków do widoków indeksu dla uczniów i rejestracji. Otwórz plik w pliku Views>Home>Index.cshtml, który jest stroną główną witryny. Dodaj następujący kod poniżej jumbotronu.

<div>
    @Html.ActionLink("List of students", "Index", "Students")<br />
    @Html.ActionLink("List of enrollments", "Index", "Enrollments")
</div>

W przypadku metody ActionLink pierwszy parametr jest tekstem wyświetlanym w linku. Drugi parametr to akcja, a trzeci parametr to nazwa kontrolera. Na przykład pierwszy link wskazuje akcję Indeks w aplikacji StudentsController. Rzeczywiste hiperłącze jest konstruowane z tych wartości. Pierwszy link ostatecznie przenosi użytkowników do pliku Index.cshtml w folderze Views/Students .

Wyświetlanie widoków uczniów

Sprawdzisz, czy kod dodany do projektu poprawnie wyświetla listę uczniów i umożliwia użytkownikom edytowanie, tworzenie lub usuwanie rekordów uczniów w bazie danych.

Kliknij prawym przyciskiem myszy plik Views>Home>Index.cshtml , a następnie wybierz pozycję Widok w przeglądarce. Na stronie głównej aplikacji wybierz pozycję Lista uczniów.

Zrzut ekranu przedstawiający stronę główną My A A S P dot NET. Lista uczniów jest zakreślina na czerwono.

Na stronie Indeks zwróć uwagę na listę uczniów i linki do modyfikowania tych danych. Wybierz link Utwórz nowy i podaj kilka wartości dla nowego ucznia. Kliknij przycisk Utwórz i zwróć uwagę, że nowy student zostanie dodany do listy.

Wróć na stronę Indeks , wybierz link Edytuj i zmień niektóre wartości dla ucznia. Kliknij przycisk Zapisz i zwróć uwagę, że rekord ucznia został zmieniony.

Na koniec wybierz link Usuń i potwierdź, że chcesz usunąć rekord, klikając przycisk Usuń .

Bez pisania kodu dodano widoki, które wykonują typowe operacje na danych w tabeli Student.

Być może zauważono, że etykieta tekstowa pola jest oparta na właściwości bazy danych (takiej jak LastName), która niekoniecznie jest wyświetlana na stronie internetowej. Na przykład możesz preferować etykietę Last Name (Nazwisko). Ten problem z wyświetlaniem zostanie rozwiązany w dalszej części samouczka.

Wyświetlanie widoków rejestracji

Baza danych zawiera relację jeden do wielu między tabelami Student i Enrollment oraz relacją jeden do wielu między tabelami Kurs i Rejestracja. Widoki rejestracji prawidłowo obsługują te relacje. Przejdź do strony głównej witryny i wybierz link Lista rejestracji , a następnie link Utwórz nowy .

Widok wyświetla formularz do tworzenia nowego rekordu rejestracji. W szczególności zwróć uwagę, że formularz zawiera listę rozwijaną CourseID i listę rozwijaną StudentID . Oba są wypełniane wartościami z powiązanych tabel.

Ponadto walidacja podanych wartości jest automatycznie stosowana na podstawie typu danych pola. Klasa wymaga liczby, więc jeśli spróbujesz podać niezgodną wartość, zostanie wyświetlony komunikat o błędzie: Klasa pola musi być liczbą.

Sprawdzono, że automatycznie generowane widoki umożliwiają użytkownikom pracę z danymi w bazie danych. W następnym samouczku z tej serii zaktualizujesz bazę danych i wprowadzisz odpowiednie zmiany w aplikacji internetowej.

Następne kroki

W tym samouczku zostały wykonane następujące czynności:

  • Dodano szkielet
  • Dodano łącza do nowych widoków
  • Wyświetlane widoki uczniów
  • Wyświetlane widoki rejestracji

Przejdź do następnego samouczka, aby dowiedzieć się, jak zmienić bazę danych.

Zmienianie bazy danych