Simple Registration form in asp.net MVC C# with validation: In this tutorial, we will see how we can create a simple and responsive registration form in asp.net MVC. Here you will see the step-by-step process.
Prerequisite to make registration form in asp.net MVC
- Basic of HTML,CSS and JavaScript
- Database (Table, Procedure)
- Web Config Connectivity
- C#
Steps to Create Registration Form in asp.net MVC C#
Back-end process
- Create one table (SQL Server) in which our record will be inserted.
- Create a store procedure to insert data.
Front-end / CodeBehind process
Let's see the step by step process to develop the registration form in asp.net MVC c#
Step #1
Step #2
Step #3
Step #4
CREATE TABLE [dbo].[tbl_customer](
[customer_id] [bigint] IDENTITY(1,1) NOT NULL,
[customer_name] [varchar](200) NOT NULL,
[address_text] [varchar](600) NULL,
[contact_no] [varchar](50) NULL,
[email] [varchar](500) NULL,
[password] [varchar](500) NULL,
)
CREATE Procedure [dbo].[UserRegistration]
@customer_name varchar(200) NOT NULL,
@address_text varchar(600) NULL,
@contact_no varchar(50) NULL,
@email varchar(500) NULL,
@password varchar(500) NULL
as
Begin
insert
into tbl_customer(customer_name,address_text,contact_no,email,password)
values (@customer_name,@address_text,@contact_no,@email,@password)
Select
1 as msg
End
Step #5
SqlConnection con = new
SqlConnection(ConfigurationManager.ConnectionStrings["MYCON"].ConnectionString);public ActionResult registration()
{
return View();
}
[HttpPost]
public ActionResult registration(user model)
{
return View();
}
Step #6
public class user
{
[Required(ErrorMessage = "*")]
public string customer_name { get; set; }
[Required(ErrorMessage = "*")]
public string address_text { get; set; }
[Required(ErrorMessage = "*")]
public string contact_no { get; set; }
[Required(ErrorMessage = "*")]
public string email { get; set; }
[Required(ErrorMessage = "*")]
public string password { get; set; }
}
Step #7
Step #8
After Selecting the Template And Model Class, Click on Add
@model MyFirstApp.Models.user
@{
ViewBag.Title = "registration";
}
<h2>registration</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>user</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.customer_name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.customer_name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.customer_name, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.address_text, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.address_text, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.address_text, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.contact_no, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.contact_no, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.contact_no, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.email, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.email, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.email, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.password, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.password, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.password, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
Step #9
Again Come on HomeController And Add these Source Code
[HttpPost]
public ActionResult registration(user model)
{
DataTable dtt = new DataTable();
SqlParameter[] param = new SqlParameter[]
{
new SqlParameter("@email_id",model.customer_name),
new SqlParameter("@address_text",model.address_text),
new SqlParameter("@contact_no",model.contact_no),
new SqlParameter("@email",model.email),
new SqlParameter("@password",model.password)
};
dtt = SaveData("UserRegistration", param);
if (dtt.Rows.Count > 0)
{
if (Convert.ToInt32(dtt.Rows[0]["msg"]) == 1)
{
ViewBag.Msg = "Data Saved !";
}
}
return View();
}
public DataTable SaveData(string ProName, SqlParameter[] Param)
{
DataTable dt = new DataTable();
try
{
con.Open();
SqlCommand cmd = new SqlCommand(ProName, con);
cmd.CommandType = CommandType.StoredProcedure;
foreach (SqlParameter prm in Param)
{
cmd.Parameters.Add(prm);
}
SqlDataAdapter adp = new SqlDataAdapter(cmd);
adp.Fill(dt);
}
catch (Exception)
{
}
finally
{
con.Close();
}
return dt;
}
Step #10
<connectionStrings>
<add name="MYCON" connectionString="Data Source=Desktop;Initial Catalog=YourDataBaseName;integrated security=true;" />
</connectionStrings>
Step #11
Now Fill the Data And Click on Create.
Post a Comment