Post
Ask Question

Display data in textbox using MVC


Introduction : This is a very simple application developed using a ASP.NET MVC tools. This application will show Employee data in a text box. The Model-View-Controller (MVC) architectural pattern separates an application into three main components; model, view, and  controller. The ASP.NET MVC framework provides an alternative to the ASP.NET Web Forms pattern for creating Web applications. MVC is a standard design pattern that many developers are familiar with. Some types of Web applications will benefit from the MVC framework. The MVC pattern helps you create applications that separate the different aspects of the application (input logic, business logic, and UI logic), while providing a loose coupling between these elements. This application using a MVC tools and show the data on a text box. some simple step follow that is given below-

Step 1:

  • Open Visual Studio 2010.
  • Click file ->New->Projects.
  • Add MVC ASP. NET 2 Empty Web application.

START.gif

Step 2:

  • Right Click on the Models folder.
  • Add->Add new items->add class.
  • Class name is Employee.
    •

MODEL1.gif

mdelclass.gif

Code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace DataShow.Models
{
    public class Manish
    {
        public string name { get;set;}
        public int id {get;set;}
        public int salary { get; set; }
        public string address { get; set; }
    }
}

Step 3:

  • Right Click on the controllers folder
  • Add->controller
  • Controller name is "bhanu".
cccccc.gif

controller.gif

Code:

using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Web;
 using System.Web.Mvc;
 using DataShow.Models;
 namespace DataShow.Controllers
{
    public class BhanuController : Controller
    {
        //
        // GET: /Bhanu/
        public ActionResult Index()
        {
            Manish mana = new Manish();
            mana.name = "Rajesh tripathi";
            mana.id = 1001;
            mana.salary = 30000;
            mana.address = "Awajapur";
            return View(mana)}
        } 
    }
}
step 4:

  • Right Click on the Action result object.
  • Add view.
  • View name is "Index".
  • Tick a checkbox and create a strong type view.
add-view.gif

view.gif

viewdadad.gif

Code:

 <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<DataShow.Models.Manish>" %>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <script runat="server">
    protected void Page_Load(object sender, EventArgs e)
   {
        TextBox1.Text = Model.name;
        TextBox2.Text = Model.id.ToString();
        TextBox3.Text = Model.salary.ToString();
        TextBox4.Text = Model.address;
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
 <head runat="server">
    <title>Index</title>
    <style type="text/css">
        #form1 {
            font-weight: 700;
        }
    </style>
 </head>
<body bgcolor="#99ccff"
    style="z-index: 1; left: 0px; top: 0px; position: absolute; height: 119px; width: 744px">
   <form id="form1" runat="server">
    <div>
    </div>
Name of Employee  
    <asp:TextBox ID="TextBox1" runat="server" BackColor="#FF9999" ></asp:TextBox>
    <br />
    Employee Id
    <asp:TextBox ID="TextBox2" runat="server" BackColor="#FF9999"
        BorderColor="#FF99FF" ></asp:TextBox>
    <br />
Employee Salary  
    <asp:TextBox ID="TextBox3" runat="server" BackColor="#FF6699"
        style="position: relative; top: 0px" ></asp:TextBox>
    <br />
     Employee Address
    <asp:TextBox ID="TextBox4" runat="server" BackColor="#FF6699" ></asp:TextBox>
    <br />
    </form>
 </body>
</html>

Step 5:

  • Crtl+f5 and run the Application.
Output:

outout.gif


Similar Articles