In this tutorial we will discuss about HiddenInput and
ReadOnly Attribute in asp.net MVC.
Hidden Input Attribute
Basically HiddenInput
Attribute is used when we want to render a application property using InputType = Hidden. This is mostly used
when we want that user is not able to see or edit the property, for this we
need to post this property to the server when we submit this form.
This HiddenInput Attribute is present in System.Web.Mvc namespace.
Before proceeding this tutorial first go through to
this tutorial Link we learn Various Type of attribute in asp.net mvc .
Step(1):- In
previous tutorial we create a partial class of student.edmx we will take that
student.cs class and we will make changes in that class means there we added a
ID property which is decorated with HiddenInput
attribute.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel;
namespace MVCApplicationWithVariousAttribute.Models
{
[MetadataType(typeof(StudentMetaData))]
public partial class Student
{
}
public class StudentMetaData
{
// Id property is
hidden and cannot be changed
[HiddenInput(DisplayValue=false)] public int Id { get; set; } // Display mail to hyperlink [DataType(DataType.EmailAddress)] public string EmailAddress { get; set; } // Display currency symbol. For country specific currency, set // culture using globalization element in web.config. // For Great Britain Pound symbol // <globalization culture="en-gb"/> [DataType(DataType.Currency)] public int? WinningPrize{ get; set; } // Generate a hyperlink [DataType(DataType.Url)] public string PersonalWebSite { get; set; } // Display only Time Part // [DataType(DataType.Time)] // Display only Date Part [DataType(DataType.Date)] public DateTime? AdmissionDate { get; set; } }
}
|
Here if we decorate this ID property with “HiddenInput” only like following
that time it will not hide this property for that we have to add [HiddenInput(DisplayValue=false)]
//This will
not hide property
[HiddenInput]
public int Id { get; set; }
[HiddenInput(DisplayValue=false)]
public int Id { get; set; } |
Now run your application and render to this following link you will see
that you will not see the ID property in this page
http://localhost/MVCApplicationWithVariousAttribute/Home/Details/1
|
Step(2):- Now if we able to edit these property so for that go to the
home controller and there we have “EDIT Action method” there we are passing ID
of student and write the following code for the edit properties
public
ActionResult Edit(int
id)
{
MVCVariousAttributeEntities _context = new MVCVariousAttributeEntities();
Student _studentDetail =
_context.Students.Where(c => c.Id == id).SingleOrDefault();
return View(_studentDetail);
// return View();
}
|
This is the controller ,now we need the View for that right click on
this action method and create a view with the name is EDIT.
and click on Add ,it
will create a view . this edit view code will be like following
@model MVCApplicationWithVariousAttribute.Models.Student
@{
ViewBag.Title = "Edit";
}
<h2>Edit</h2>
<div style="font-family" Arial>
@using (@Html.BeginForm())
{
@Html.EditorForModel()
<br />
<br />
<input type = "submit"
value = "SaveRecord" />
}
</div>
|
Now run your
application and navigate to the following link
http://localhost/MVCApplicationWithVariousAttribute/Home/Edit/1
|
Here if see the student
full detail from here if go to page source we see that we have input element
name is ID and Type is Hidden and the value is 1 so when we click on Save
record button then this ID is save to server means this information will save
in respective ID , so we can use this id to update the records.
ReadOnly Attribute :-
Readonly attribute is
present in System.ComponentModel namespace. This property make sure
that it make property Read only. Still we can make change in property but once
we will post this form Model Binder will care of ReadOnly Attribute, means when
we will post this form to server this will send this property as null and will
not make any changes in this property. We can make property of a classbt
removing SET accessor.
For example suppose we
want make readonly EmailId so add a readOnly attribute to this property in
student.cs class.
[MetadataType(typeof(StudentMetaData))]
public
partial class
Student
{
}
public
class StudentMetaData
{
#region dataType attribute
[HiddenInput(DisplayValue = false)]
public int Id { get; set; }
[ReadOnly(true)]
[DataType(DataType.EmailAddress)]
public
string EmailAddress { get; set; }
[DataType(DataType.Currency)]
public int?
WinningPrize { get; set;
}
// Generate a hyperlink
[DataType(DataType.Url)]
[UIHint("OpenInNewWindow")]
public string
PersonalWebSite { get; set; }
[DataType(DataType.Date)]
public DateTime?
AdmissionDate { get; set;
}
}
}
|
Now Go to the home controller and write the following code to the POST Edit Action method .
[HttpPost]
public ActionResult
Edit(Student student)
{
try
{
if (ModelState.IsValid)
{
MVCVariousAttributeEntities _context = new MVCVariousAttributeEntities();
Student studentFromDB =
_context.Students.Single(x => x.Id == student.Id);
// Populate all the properties except EmailAddrees
studentFromDB.FullName = student.FullName;
studentFromDB.Gender = student.Gender;
studentFromDB.Age = student.Age;
studentFromDB.PersonalWebSite = student.PersonalWebSite;
_context.ObjectStateManager.ChangeObjectState(studentFromDB,
System.Data.EntityState.Modified);
_context.SaveChanges();
return RedirectToAction("Details",
new { id = student.Id });
}
return View(student);
}
catch
{
return View();
}
}
|
Now run your application and navigate to the
following link
http://localhost/MVCApplicationWithVariousAttribute/Home/Edit/1
|
Modify every property
here and click on Save Record you will see that all property changed except
Email Id.
No comments:
Post a Comment