Introduction to MVC 4 06. Action Methods, Edit View, and a Search Feature NTPCUG Dr. Tom Perkins.

Slides:



Advertisements
Similar presentations
The Librarian Web Page Carol Wolf CS396X. Create new controller  To create a new controller that can manage more than just books, type ruby script/generate.
Advertisements

Introduction to MVC Adding a View Page NTPCUG Tom Perkins, Ph.D.
PantherSoft Financials Smart Internal Billing. Agenda  Benefits  Security and User Roles  Definitions  Workflow  Defining/Modifying Items  Creating.
Project Implementation for COSC 5050 Distributed Database Applications Lab4.
Part 03 – Sorting, Paging, and Grouping Entity Framework NTPCUG Tom Perkins.
Internet Technologies 1 Master of Information System Management Java Server Faces Model/View/Controller Design Pattern for Web Development Slides.
1 of 6 This document is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS DOCUMENT. © 2007 Microsoft Corporation.
Figure 1. Hit analysis in 2002 of database-driven web applications Hits by Category in 2002 N = 73,873 Results Reporting 27% GME 26% Research 20% Bed Availability.
Project Implementation for COSC 5050 Distributed Database Applications Lab5.
Form Handling, Validation and Functions. Form Handling Forms are a graphical user interfaces (GUIs) that enables the interaction between users and servers.
CST JavaScript Validating Form Data with JavaScript.
Tutorial: Introduction to ASP.NET Internet Technologies and Web Application 4 th February 2010.
Lesson 13: Building Web Forms Introduction to Adobe Dreamweaver CS6 Adobe Certified Associate: Web Communication using Adobe Dreamweaver CS6.
Introduction to MVC Adding Model Classes NTPCUG Tom Perkins, Ph.D.
Database-Driven Web Sites, Second Edition1 Chapter 8 Processing ASP.NET Web Forms and Working With Server Controls.
Chapter 5 Java Script And Forms JavaScript, Third Edition.
Chapter 6: Forms JavaScript - Introductory. Previewing the Product Registration Form.
Overview of Previous Lesson(s) Over View  ASP.NET Pages  Modular in nature and divided into the core sections  Page directives  Code Section  Page.
BIT 286: Web Applications Lecture 04 : Thursday, January 15, 2015 ASP.Net MVC - Models.
Part 06 – A More Complex Data Model Entity Framework and MVC NTPCUG Tom Perkins.
Project Implementation for COSC 5050 Distributed Database Applications Lab3.
LiveCycle Data Services Introduction Part 2. Part 2? This is the second in our series on LiveCycle Data Services. If you missed our first presentation,
CSCI 6962: Server-side Design and Programming Introduction to Active Server Pages.
Introduction to ASP.NET MVC Information for this presentation was taken from Pluralsight Building Applications with ASP.NET MVC 4.
Introduction to Entity Framework Part 2 CRUD Scaffolding Tom Perkins NTPCUG.
Using Client-Side Scripts to Enhance Web Applications 1.
JavaScript, Fourth Edition Chapter 5 Validating Form Data with JavaScript.
Execute Workflow. Home page To execute a workflow navigate to My Workflows Page.
Website Development with PHP and MySQL Saving Data.
 Whether using paper forms or forms on the web, forms are used for gathering information. User enter information into designated areas, or fields. Forms.
State of Kansas Travel Authorizations Statewide Management, Accounting and Reporting Tool Entering a Travel Authorization Navigation: Employee Self Service.
CSCI 6962: Server-side Design and Programming Database Manipulation in ASP.
1 © Netskills Quality Internet Training, University of Newcastle HTML Forms © Netskills, Quality Internet Training, University of Newcastle Netskills is.
How to Build a Struts Application with JBuilder 9.
1 אירוע אמאזון. 2 שלבי הפיתוח עם דיאגרמות UML 3 אמאזון תרשים תוכן.
Course ILT Forms and queries Unit objectives Create forms by using AutoForm and the Form Wizard, and add or modify form headers and footers Open and enter.
Access Forms and Queries. Entering Data in Your Table  You can add data to your table in Datasheet view, by typing in the columns and rows.  This.
BIT 286: Web Applications Lecture 10 : Thursday, February 5, 2015 ASP.Net Form Submission.
Introduction to MVC Introduction NTPCUG Tom Perkins, Ph.D.
Introduction to MVC Controllers NTPCUG Tom Perkins, Ph.D.
T U T O R I A L  2009 Pearson Education, Inc. All rights reserved Bookstore Application: Middle Tier Introducing Code-Behind Files, Session State.
CSCI 6962: Server-side Design and Programming JSF DataTables and Shopping Carts.
8 Chapter Eight Server-side Scripts. 8 Chapter Objectives Create dynamic Web pages that retrieve and display database data using Active Server Pages Process.
BIT 286: Web Applications Lecture 04 : Thursday, January 15, 2015 ASP.Net MVC -
Since you’ll need a place for the user to enter a search query. Every form must have these basic components: – The submission type defined with the method.
Chapter 12© copyright Janson Industries Java Server Faces ▮ Explain the JSF framework ▮ SDO (service data objects) ▮ Facelets ▮ Pagecode classes.
T U T O R I A L  2009 Pearson Education, Inc. All rights reserved Address Book Application Introducing Database Programming.
JavaScript Events Java 4 Understanding Events Events add interactivity between the web page and the user You can think of an event as a trigger that.
Chapter 29. Copyright 2003, Paradigm Publishing Inc. CHAPTER 29 BACKNEXTEND 29-2 LINKS TO OBJECTIVES Attach an XML Schema Attach an XML Schema Load XML.
JavaScript Events. Understanding Events Events add interactivity between the web page and the user Events add interactivity between the web page and the.
BIT 286: Web Applications Lecture 04 : Thursday, January 15, 2015 ASP.Net MVC -
BIT 286: Web Applications ASP.Net MVC. Objectives Applied MVC overview Controllers Intro to Routing Views ‘Convention over configuration’ Layout files.
Lesson 5 Introduction to HTML Forms. Lesson 5 Forms A form is an area that can contain form elements. Form elements are elements that allow the user to.
Client-side (JavaScript) Validation. Associating a function with a click event – Part 1 Use the input tag’s onclick attribute to associate a function.
1 Adding a Model. We have created an MVC web app project Added a controller class. Added a view class. Next we will add some classes for managing movies.
Build Data Driven Apps with ASP.NET Core Rachel Appel.
Jim Fawcett CSE686 – Internet Programming Spring 2014
Asp.Net MVC Conventions
An introduction to ASP.Net with MVC Nischal S
Jim Fawcett CSE686 – Internet Programming Spring 2012
Social Media And Global Computing Introduction to The MVC Pattern
C#: ASP.NET MVC Overview
Play Framework: Introduction
Social Media And Global Computing Managing MVC with Model Validation
Controllers.
Customizing Views Views Customize කර ගැනීම
Social Media And Global Computing Managing MVC with Custom Models
05 | Customizing Views Jon Galloway | Development Platform Evangelist
MVC Controllers.
Asp.Net MVC Conventions
Presentation transcript:

Introduction to MVC Action Methods, Edit View, and a Search Feature NTPCUG Dr. Tom Perkins

The Edit Link Run the application Append /Movies to the URL (browse to the Movies controller) Hover over the Edit link Examine the generated URL

The Edit link was generated by the Html.ActionLink method in the Views\Movies\Index.cshtml "Edit", new { id=item.ID }) Hover

The ActionLink HtmlHelper Generates a link to an action method on a controller Arguments: – 1) Text to render (Edit Me) – 2) Name of action method in controller (Edit) – 3) anonymous object  route data (ID=4)

Alternative: Pass Parameters Using Query String URL of: Request sent to Controller: Movies Action Method: Edit Parameter ID: 4

2 Edit Actions in the Movies Controller // // GET: /Movies/Edit/5 public ActionResult Edit(int id = 0) { Movie movie = db.Movies.Find(id); if (movie == null) { return HttpNotFound(); } return View(movie); } // // POST: /Movies/Edit/5 [HttpPost] public ActionResult Edit(Movie movie) { if (ModelState.IsValid) { db.Entry(movie).State = EntityState.Modified; db.SaveChanges(); return RedirectToAction("Index"); } return View(movie); } HttpPost Attribute Invoked ONLY for POST requests Default: Implied [HttpGet] attribute Invoked for GET requests

The HTTPGet Edit Method 1. movie ID paramter input (default = 0) 2.Entity Framework Find used to look up the movie 3.If movie cant be found, return HttpNotFound() 4.The Model movie object is passed to the view When the Edit View was created, the system scanned the model and generated the markup to edit the fields. // // GET: /Movies/Edit/5 public ActionResult Edit(int id = 0) { Movie movie = db.Movies.Find(id); if (movie == null) { return HttpNotFound(); } return View(movie); }

The Generated Edit View (Part ViewBag.Title = "Edit"; } Edit The View expects that the Model it receives will be of type Movie

The Generated Edit View (Part (Html.BeginForm()) => => => => model.Title) … LabelFor displays the name of the field HtmlEditorFor renders an statement ValidationMessageFor displays validation messages associated with field

Run the Application Navigate to /Movies URL Click an Edit link View the source for the page Examine the HTML for the Form element Note: Html elements are in a element Form action attribute is set to post When Edit button is clicked, data will be posted to the server

Server actions when the Save button is clicked and the data is posted: The values from the Form are transformed into a Movie object by the ASP MVC model binder. The Movie object is passed to the Edit action in the Movies controller. The ModelState.IsValid method determines whether or not the data submitted in the form is OK, the data is saved in the db MovieDBContext instance. The movie data is saved to the database. The user is redirected to the Index action, which displays the data with changes. If form data is invalid, data is re- displayed with error messages created by Html.ValidationMessageFor helpers. [HttpPost] public ActionResult Edit(Movie movie) { if (ModelState.IsValid) { db.Entry(movie).State = EntityState.Modified; db.SaveChanges(); return RedirectToAction("Index"); } return View(movie); }

Posting Edited Form Data Form Edited Data ModelState.IsValid method Valid data Data saved to database Data sent to Index action, data (including changes) is displayed Invalid data sent back to form with error messages and form is redisplayed.

Validation error messages

Add a Search Method and View Objective: allow the user to search for movies by genre or name Add a SearchIndex action to the controller SearchAction method generates Html form for user to enter genre or name Get Search Values Search Database Display Results User submits search criteria

Add a SearchIndex method to the MoviesController class s => s.Title is a Lambda expression Used in LINQ queries LINQ queries not executed when defined or modified (deferred) Executed when value is used or in ToList() Execution takes place in View public ActionResult SearchIndex(string searchString) { var movies = from m in db.Movies select m; if (!String.IsNullOrEmpty(searchString)) { movies = movies.Where(s => s.Title.Contains(searchString)); } return View(movies); }

Display the Search form for the User Create a SearchIndex View: Right click inside the SearchIndex Method In the AddView dialog box: – Pass a Movie object to the view – Choose List in the Scaffold Template – Click Add

The Create ViewBag.Title = "SearchIndex"; } New", "Create") Title ReleaseDate Genre (var item in Model) => => => => "Edit", new { id=item.ID }) "Details", new { id=item.ID }) "Delete", new { id=item.ID }) }

Run the App Navigate using /Movies/SearchIndex?searchString=ghost

Add a ViewBag.Title = "SearchIndex"; } New", (Html.BeginForm()){ }

FINIS