Mes: febrero 2020

Ampliación ejercicio Razor

Cada producto puede tener una serie de pedidos. Los pedidos tienen los siguientes campos:

Fecha de pedido (no puede ser ni menor que el día de hoy, ni mayor que dentro de 30 días)
Urgente (true/false)
Modo de envío: Seleccionar entre Correo normal, certificado o recogida en tienda
Observaciones: Campo libre de texto (grande)

Dentro del detalle de producto tendremos un botón para añadir un pedido.
También tendremos, dentro del detalle del producto, la lista de pedidos de ese producto. En esa lista tenemos la posibilidad de borrarlos.

En la pantalla principal de la lista de productos se verá el número de pedidos que tiene cada producto.

HTML helpers en razor

https://www.tutorialsteacher.com/mvc/html-helpers

@Html.TextBox("StudentName", null, new { @class = "form-control" })

<input class="form-control"
id="StudentName"
name="StudentName"
type="text"
value="" />

@Html.TextBoxFor(m => m.StudentName, new { @class = "form-control" })  
<input class="form-control" 
        id="StudentName" 
        name="StudentName" 
        type="text" 
        value="John" />



@Html.CheckBox("isNewlyEnrolled", true)



<input checked="checked" 
        id="isNewlyEnrolled" 
        name="isNewlyEnrolled" 
        type="checkbox" 
        value="true" />


Male:   @Html.RadioButton("Gender","Male")  
Female: @Html.RadioButton("Gender","Female")  


Male: <input checked="checked" 
        id="Gender" 
        name="Gender" 
        type="radio" 
        value="Male" />

Female: <input id="Gender" 
        name="Gender" 
        type="radio" 
        value="Female" />


@Html.DropDownList("StudentGender", 
                    new SelectList(Enum.GetValues(typeof(Gender))),
                    "Select Gender",
                    new { @class = "form-control" })


<select class="form-control" id="StudentGender" name="StudentGender">

    <option>Select Gender</option>

    <option>Male</option>

    <option>Female</option>

</select>


Editor:

https://www.tutorialsteacher.com/mvc/htmlhelper-editor-editorfor

Asistentes de etiquetas

Delimitadoras: https://docs.microsoft.com/es-es/aspnet/core/mvc/views/tag-helpers/built-in/anchor-tag-helper?view=aspnetcore-3.1

asp-controller El nombre del controlador.
asp-action El nombre del método de acción.
asp-area El nombre del área.
asp-page El nombre de la página de Razor.
asp-page-handler El nombre del controlador de páginas de Razor.
asp-route El nombre de la ruta.
asp-route-{value} Un valor único de ruta de dirección URL. Por ejemplo: asp-route-id="1234".
asp-all-route-data Todos los valores de ruta.
asp-fragment El fragmento de dirección URL.

Ejemplos:

<a asp-controller="Speaker"
asp-action="Index">All Speakers</a>

<a href="/Speaker">All Speakers</a>

<a asp-controller="Speaker"
asp-action="Evaluations">Speaker Evaluations</a>

<a href="/Speaker/Evaluations">Speaker Evaluations</a>



De formulario:

https://docs.microsoft.com/es-es/aspnet/core/mvc/views/working-with-forms?view=aspnetcore-3.1#the-form-tag-helper


<form asp-controller="Demo" asp-action="Register" method="post">
<!-- Input and Submit elements -->
</form>

<form method="post" action="/Demo/Register">
<!-- Input and Submit elements -->
<input name="__RequestVerificationToken" type="hidden" value="<removed for brevity>">
</form>


Entrada:

https://docs.microsoft.com/es-es/aspnet/core/mvc/views/tag-helpers/built-in/image-tag-helper?view=aspnetcore-3.1


@model RegisterViewModel

<form asp-controller="Demo" asp-action="RegisterInput" method="post">
Email: <input asp-for="Email" /> <br />
Password: <input asp-for="Password" /><br />
<button type="submit">Register</button>
</form>

<br data-mce-bogus="1">

<form method="post" action="/Demo/RegisterInput">
Email:
<input type="email" data-val="true"
data-val-email="The Email Address field is not a valid email address."
data-val-required="The Email Address field is required."
id="Email" name="Email" value=""><br>
Password:
<input type="password" data-val="true"
data-val-required="The Password field is required."
id="Password" name="Password"><br>
<button type="submit">Register</button>
<input name="__RequestVerificationToken" type="hidden" value="<removed for brevity>">
</form>


Para crear select:

https://docs.microsoft.com/es-es/aspnet/core/mvc/views/working-with-forms?view=aspnetcore-3.1#the-select-tag-helper


<select asp-for="Country" asp-items="Model.Countries"></select>

<span class="hljs-tag"><<span class="hljs-name">select</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"Country"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"Country"</span>></span> <span class="hljs-tag"><<span class="hljs-name">option</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"MX"</span>></span>Mexico<span class="hljs-tag"></<span class="hljs-name">option</span>></span> <span class="hljs-tag"><<span class="hljs-name">option</span> <span class="hljs-attr">selected</span>=<span class="hljs-string">"selected"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"CA"</span>></span>Canada<span class="hljs-tag"></<span class="hljs-name">option</span>></span> <span class="hljs-tag"><<span class="hljs-name">option</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"US"</span>></span>USA<span class="hljs-tag"></<span class="hljs-name">option</span>></span> <span class="hljs-tag"></<span class="hljs-name">select</span>></span>


Mensajes validación:

https://docs.microsoft.com/es-es/aspnet/core/mvc/views/working-with-forms?view=aspnetcore-3.1#the-validation-message-tag-helper



<span asp-validation-for="Email"></span>

<span class="field-validation-valid"
data-valmsg-for="Email"
data-valmsg-replace="true"></span>

Ejercicio Razor Pages

Añadir en cada línea de producto en el index el precio con IVA (21%) El iva lo guardaremos como propiedad en el IndexModel.

Crear una página llamada ‘Caro’ que nos muestre el producto más caro. Si hay varios productos que tienen el mismo precio mostrarlos todos.

Crear en la página de nuevo producto un botón nuevo que nos cree tres copias del producto que estamos añadiendo. Es decir, tendremos el guardar normal y el crear copias que nos lo añade y tres copias más.

Ejercicios Razor

1.- Sucesión fibonacci. En un input introducimos un número y mostramos la sucesión de fibonacci hasta ese número.

2.- Anillos. En un input ponemos un tamaño y mostramos una tabla cuadrada con lado de ese tamaño y de colores negro y blanco alternando en forma de anillo.

3.- Generador de contraseñas. Ponemos un select que tiene: 1) letras 2)letras y números 3) letras números y símbolos. Un input para el tamaño. Al enviar nos genera una contraseña aleatoria con el tamaño y el juego de caracteres indicado.

Algoritmo anillos


n = 10;
int[,] tabla = new int[n, n];
for(int i = 0; i < n; i++)
{
for(int j = 0; j < n; j++)
{
tabla[i, j] = 1;
}
}
for(int i = 1; i <= n / 2; i += 2)
{
for(int j = i; j < n- i; j++)
{
tabla[i, j] = 0;
tabla[j, i] = 0;
tabla[n-i-1, j] = 0;
tabla[j, n-i-1] = 0;
}
}

Ejemplos Razor


@page
@model RazorPruebas.IndexModel
@{
}
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
@* Single Line Statements *@
@{var message = "I am Single Line Statements";}
@* Inline Markup *@
<h5>The message is : @message</h5>

@* This is Code Block *@
@{
var num1 = 5;
var num2 = 10;
var result = num1 + num2;
}
@* Inline Markup *@
<h5>Sum of @num1 + @num2 = @result</h5>

@{
<h5>Url : @Request.Path</h5>
<h5>Host : @Request.Host</h5>

}

@{
int i = 5;
if (i < 5)
{
message = "It is less than 5";
}
else
{
message = "It is greater than 5";
}
}

@* I am comment and I will not be appear on the page *@
@*
I am multi line comment.
I will also not appear in web pages.
*@
<h5>@message</h5>

@{
string year, day, month, time;
year = DateTime.Now.Year.ToString();
day = DateTime.Now.DayOfWeek.ToString();
month = DateTime.Now.Month.ToString();
time = DateTime.Now.ToShortTimeString();
}

<h5>Current Year: @year</h5>
<h5>Current Day : @day</h5>
<h5>Current Month: @month</h5>
<h5>Current Time: @time</h5>

@{
int plus, minus, multi, divide;
num1 = 45;
num2 = 9;
plus = num1 + num2;
minus = num1 - num2;
multi = num1 * num2;
divide = num1 / num2;
}
<h5>Addition : @num1 + @num2 = @plus</h5>
<h5>Subtraction : @num1 - @num2 = @minus</h5>
<h5>Multiplication : @num1 * @num2 = @multi</h5>
<h5>Divide : @num1 / @num2 = @divide</h5>

@{
int[] anum1 = { 12, 52, 66, 92, 28 };
int[] anum2 = { 73, 12, 98, 23, 52 };

for (i = 0; i < 5; i++)
{
for (int loop = 0; loop < 5; loop++)
{
if (anum1[i] == anum2[loop])
{
<h5>Match Found : @anum1[i]</h5>
}
}
}
}

@{
int[] arr = { 1, 3, 5, 7, 11, 13, 17, 19 };
foreach (int x in arr)
{
<span>@x, </span>
}
}

@{
//Single Dimensional Array
<h3>Single Dimensional Array</h3>
int[] arr2 = { 1, 3, 5, 7, 11, 13, 17, 19 };
foreach (int x in arr2)
{
<span>@x, </span>
}

//Multi Dimensional Array
<h3>Multi Dimensional Array</h3>
string[,] letter = new string[3, 2] { { "a", "b" }, { "c", "d" }, { "e", "f" } };
for (i = 0; i < 3; i++)
{
for (int j = 0; j < 2; j++)
{
<span>@letter[i, j], </span>
}
<br />
}
}

@{
var result2 = new Dictionary<string, int>();
result2.Add("Jack", 75);
result2.Add("Steven", 80);
result2.Add("Clark", 95);
}
<h3>Results of the students are:</h3>
<h3>Jack : @result2["Jack"]</h3>
<h3>Steven : @result2["Steven"]</h3>
<h3>Clark : @result2["Clark"]</h3>
@functions{
public int sum(int x, int y)
{
return x + y;
}
public int dividir(int x, int y)
{
string errormessage;
try
{
return x / y;
}
catch (DivideByZeroException d)
{
errormessage = d.ToString();
WriteLiteral("<br />Cannot Divide by Zero Exception found <br /><br />");
WriteLiteral("Additional Info <br /><br />" + errormessage);
return 0;
}
}
}
<h3>Add of 5 + 6 is @sum(5, 6)</h3>
<h3>Add of 9 + 10 is @sum(9, 10)</h3>

<h3>Division of 10 / 5 is @dividir(10, 5)</h3>
<h3>Add of 12 + 0 is @dividir(12, 0)</h3>
</body>
</html>