Saltar apartados

Model

Creating a model

The process of traspaso of information between the procedure and the sight can do interminable when we want to happen a lot of information.

It is the moment to create a model and begin to trabar with the 3 elements of MVC.

To create a model go us to the folder Models, and with the right button select to Add -> Class …

Crear una clase en la carpeta donde se almacenan los modelos

And we called it catalogador.cs.

Now we added him 3 properties. Here it begins an of the differences with what were accustomed, because we go us to define some private variables and to his time some public properties for referenciarlas. The format will be the following:

///

/// Description of the property

///

public Type NombrePropiedad

{

get;

set;

}

Of this form can it instanciar and besides use like XXXXX.

In our case go to add 5 properties:

• 3 of type chain of text, Description, CSS and Logo

• 1 of boolean type, Visible

• 1 of whole type, Go

The result would be the following

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

namespace MvcUA.Models

{

///

/// Class for gestionar the Catalogador

///

public class catalogador

{

///

/// Only identifier of each Catalogue

///

public int Go

{

get;

set;

}

///

/// We indicate the complete name of the Catalogue

///

public string Descripcion

{

get;

set;

}

///

/// Leaf of style that defines to the catalogador

///

public string Css

{

get;

set;

}

///

/// Logo Of the catalogador

///

public string Logo

{

get;

set;

}

///

/// We indicate if the Catalogue is visible or no

///

public bool Visible

{

get;

set;

}

}

}

Now we go to instanciarlo from a controller. We go to create one new that call CatalogadorController. We created us a new method that will be to Edit, to the that will not go through the moment any parameter.

As we want to access to the model, have to include in the cabecera an access to the models.

using MvcUA.Models;

Now we can instanciarlo from the method Edit.

public ActionResult Edit()

{

catalogador cat = new catalogador { Go = 1, Descripcion = "Catalogador 1", Visible = false };

return View(cat);

}

As you can observe, can define the properties of the object in the moment of the definition. In our case have defined the Go, the Description and if it is Visible.

Afterwards we assigned it like parameter in the call View.

Using the model in the sight

Now we go to create a sight for this method. We situated us on the method and with the right button, selected the first option Add View …

Asignar un modelo cuando creamos una vista

We mark Create to strongly-typed view and treated to select the class catalogador. If it does not appear (as the case of the image) owe to that before have to generate the solution and like this the surroundings recognises the changes add (especially the references using that have added).

Therefore we generate the solution and go back to repeat the process. Now we will see that himself that leaves us select the class and besides actuates us the desplegable of view content. We select Edit.

Visualización del modelo en la vista después de generar la solución

We see that it generates us a lot of code, but that at bottom is a description and a box for each property of the object.

In the top does reference to the model with which goes to work.

If we fixed us in one any one of the fields, see that it does use of the properties with model => model.NOMBREPROPIEDAD

div class="Editor-label">

<%= Html.LabelFor(model => model.Go) %>

<%= Html.TextBoxFor(model => model.Go) %>

<%= Html.ValidationMessageFor(model => model.Go) %>

Now it is moment to test what have done and can see the goodnesses that begins to contribute us these surroundings.

We pressed CTRL+F5 and added to the URL by defect / by /Catalogador/Edit

Visualización del modelo en el navegador

It has created us all the fields and besides allows us go back to the listing of all the catalogadores (by defect takes for granted that it is the method Index)

We go to improve the sight and go to realise a pair of changes to improve the appearance.

  1. We go to do that the Visible field are a checkbox.
    It defines it like <%= Html.TextBoxFor(model => model.Visible) %>
    We erase TextBoxFor and if we began to write see that it offers us CheckBoxFor<%= Html.CheckBoxFor(model => model.Visible) %>
  2. We go to change the description of the recuadro of all the fields, happening of Fields to Catalogador
    Catalogador
  3. We change the description of the button Save. We look for the button submit and changed his value for Updating
  4. We change the description and the link of Back to List. For this go us to the element Html.ActionLink That afterwards will see in more detail, because it is very useful and changed the description by a part and the method to the that called.
    <%= Html.ActionLink("Listing of Catalogadores", "Listing") %>

We generate the solution and see the changes.

Pequeños cambios en la vista para visualizar mejor el modelo

This already begins to be something more alike to what looked for, but is the moment to add a Master Page to the project (Master Page) to give him a more professional appearance.

We go to add it in the folder Views->Shared so that it was shared by all the sights. We select to Add -> existent Element …

Incorporando páginas principales (masterpage) a las vistas

And we looked for it in the folder shared with the professor. It has the name Site.Master.

If all is correct will appear in the folder.

Ubicación masterpage en el proyecto

Now already we can use it when we believe any sight, but if we want to assign it in sight already created, go us to the cabecera of the sight and began to write MasterPageFile= and pressing Intro on the assistant, allows us look for the Master Page.

Uso masterpages en una vista

We select the one who have added previously and have to erase the code HTML that have in the sight and turned it into a ContentPlaceHolder than where situates the content the Master Page. This that are doing is not very normal but goes us to allow that a page that has not generated with Master Page can use them.

<%@ Page Language="C#" MasterPageFile="/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<% using (Html.BeginForm()) {%>

<%= Html.ValidationSummary(true) %>

The final result can see it when generating the solution.

Visualizar el modelo con la página principal (masterpage)

Computing service ASP.NET MVC 2 Framework


Universidad de Alicante
Carretera de San Vicente del Raspeig s/n
03690 San Vicente del Raspeig
Alicante (Spain)

Tel: (+34) 96 590 3400

Fax: (+34) 96 590 3464

For further information: informacio@ua.es, and for enquiries on this web server: webmaster@ua.es

Carretera San Vicente del Raspeig s/n - 03690 San Vicente del Raspeig - Alicante - Tel. 96 590 3400 - Fax 96 590 3464