Tuesday, 16 September 2014

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 { getset; }
        public string address { getset; }
    }
}
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-weight700;
        }
    </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

0 comments:

Post a Comment