I have a view, in the view, I have a section where you can enter the customer account number and then press search
I want the search to query the SQLSERVER for the account number details and retrieve the other details like Name, Account Balance and the likes.
I have finished the View code but I am confused on how to implement the Controller and whether I should use AJAX to ensure that the page does not reload.
Could you advise me?
Below is the View.
#model CreditFacility_Web.Models.CreditFacilityModel.Transaction
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="w3-container" style="padding-left:60px">
#{
ViewBag.Title = "Credit Transaction";
}
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h2>Credit Transaction</h2>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Account_Number, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Account_Number, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Account_Number, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<button value="Search" class="btn btn-primary" >Search</button>
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Firstname, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Firstname, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Firstname, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Surname, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Surname, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Surname, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Phone_Number, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Phone_Number, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Phone_Number, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Account_Type, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Account_Type, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Account_Type, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Old_Balance, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Old_Balance, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Old_Balance, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Amount, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Amount, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Amount, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.New_Balance, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.New_Balance, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.New_Balance, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Transaction_Type, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Transaction_Type, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Transaction_Type, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Narration, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Narration, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Narration, "", 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-success" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
I have been able to work on the View and the Controller and below is what i have.
#section Scripts {
<script type="text/javascript">
$(document).ready(function () {
$(".btn-primary").click(function () {
var accNo = $('#Account_Number').val();
$.ajax({
url: "#Url.Action("AccountDetails", "Transactions")",
type: "POST",
dataType: "json",
data: { accountNo : accNo },
async: false,
error: function () {
alert('Account Number do not Exist Or Other Errors Occurred');
},
success: function (data) {
if (Object.keys(data).length > 0) {
$('#Firstname').val(data.Firstname);
$('#Old_Balance').val(data.Account_Balance);
}
}
});
});
});
</script>
}
And the Controller has the below.
[HttpPost]
public ActionResult AccountDetails(string accountNo)
{
using (var db = new CreditFacilityContext())
{
var accDetails = db.SavingsAccounts.Where(t => t.Account_Number == accountNo).Select(s => new SavingsAccount
{
Firstname = s.Firstname,
Account_Balance = s.Account_Balance,
//rest of properties
}).FirstOrDefault(); ;
return Json(accDetails, JsonRequestBehavior.AllowGet);
}
}
Ajax method to retrieve data without page refresh:
$(".btn-primary").click(function () {
var accNo = $('#Account_Number').val();
$.ajax({
url: "#Url.Action("AccountDetails", "Home")",
type: "POST",
dataType: "json",
data: { accountNo : accNo },
async: false,
error: function () {
},
success: function (data) {
if (Object.keys(data).length > 0) {
$('#Firstname').val(data.FirstName);
$('#Old_Balance').val(data.Balance);
}
}
});
});
Home Controller code to fetch data from SQL Server:
[HttpPost]
public JsonResult AccountDetails(string accountNo)
{
using (DBContextModel dataContext = new DBContextModel())
{
var accSearchParameter = new SqlParameter("#Search", accountNo);
var accDetails = dataContext.Database.SqlQuery<AccDetails>("EXEC YourStoredProc #Search", accSearchParameter ).Select(s => new AccDetails
{
FirstName = s.FirstName,
Balance = s.Balance,
//rest of properties
}).SingleOrDefault();
return Json(accDetails, JsonRequestBehavior.AllowGet);
}
}
Pre-requisites for the Controller code to work:
Stored procedure
AccDetails class with properties that match the select column names/aliases of SP. Try this, I think you probably need to read up on jQuery Ajax and JSON in MVC.
Related
I have created a method in the Employee controller for creating a new Employee:
[HttpGet]
[ActionName ("Create")]
public ActionResult Create()
{
return View();
}
I have Added a view for Create method with Employee(strongly-typed)model and used the create template.
When I run the program and click on create new I get a null reference error in create view.
#model BuissnessLayer.Employee
#{
ViewBag.Title = "Create";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Employee</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Employee_Id, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Employee_Id, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Employee_Id, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Employee_Name, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Employee_Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Employee_Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Employee_Age, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Employee_Age, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Employee_Age, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Employee_City, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Employee_City, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Employee_City, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Employee_Salary, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Employee_Salary, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Employee_Salary, "", 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>
<script src="~/Scripts/jquery-3.4.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
I get the error at line
#Html.EditorFor(model => model.Employee_Id, new { htmlAttributes = new { #class = "form-control" } })
I don't know how to solve the problem because the code is created automatically and i haven't edited anything yet.
You should pass model to your View..
[HttpGet]
[ActionName ("Create")]
public ActionResult Create()
{
var model = new Employee(){}
return View(model);
}
#model BuissnessLayer.Employee
I have created a form and I am inserting some data and image in my database using the form submit... But when I am opening in edit mode, all inserted data is available in the input fields except the image? How do I fix this?
View:
#model User_Management_System_V2._0.Models.Product
#{
ViewBag.Title = "Edit";
}
<h2>Edit</h2>
#using (Html.BeginForm("Edit","Products",FormMethod.Post , new { enctype = "multipart/form-data"}))
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Product</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
#*<div class="form-group">
#Html.LabelFor(model => model.ProductID, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.ProductID, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.ProductID, "", new { #class = "text-danger" })
</div>
</div>*#
#Html.HiddenFor(model => model.ProductName)
<div class="form-group">
#Html.LabelFor(model => model.Description, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Description, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Description, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.PriceExpected, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.PriceExpected, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.PriceExpected, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.OldTime, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.OldTime, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.OldTime, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Status, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Status, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Status, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Photo, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<input type="file" name="file"/>
#Html.ValidationMessageFor(model => model.Photo, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
Controller:
public ActionResult Edit(string id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Product product = db.Products.Find(id);
if (product == null)
{
return HttpNotFound();
}
return View(product);
}
Create Action
public ActionResult Create()
{
return View();
}
[HttpPost]
public ActionResult Create([Bind(Include = "ProductName,Description,PriceExpected,OldTime,Status,Photo")]Product product,HttpPostedFileBase file)
{
if (file != null)
{
product.Photo = new byte[file.ContentLength];
file.InputStream.Read(product.Photo, 0, file.ContentLength);
}
else
{
ModelState.AddModelError("", "Please Select image");
}
db.Products.Add(product);
db.SaveChanges();
return RedirectToAction("Index");
}
My main problem is that all the fields are opening in edit mode which means they are opening in edit mode with the preinserted data values in their fields but the image is not having the preinserted value.
try the following solution in jquery and pure Javascript you will only need to retrieve byte array of the image you uploaded and it's extension then just give your image control the generated src I hope it helps
var PhotoArr = []; //array of bytes from the server
var PhotoExt = "jpg";//example
if (PhotoArr) {
var byteArray = new Uint8Array(oldResume.PhotoArr);
var blob = new Blob([byteArray], { type: 'application/' + PhotoExt });
var image = $('#yourImageId');
var urlCreator = window.URL || window.webkitURL;
var imageUrl = urlCreator.createObjectURL(blob);
image.attr('src', imageUrl);
}
I can retrieve a string in this but when I try retrieving a class I'm having an exception error.
Customer = new Customer()
{
FirstName = Request.Form["FirstName"],
LastName = Request.Form["LastName "],
BillingAddress = new Address
{
StreetAddress1 = Request.Form["StreetAddress1"],
}
I already tried setting a value, it saves successfully, but when I'm getting the data from the value exception error occurs.By the way I'm using a model from the SDK. Thank you
View form
#model WebApplication16.Model.ParentModel
#{
ViewBag.Title = "Create";
Layout = "~/Views/Shared/_Layout.cshtml";
}
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>ParentModel</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
<div class="form-group">
#Html.LabelFor(model => model.Customer.FirstName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.FirstName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.FirstName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Customer.LastName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.LastName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.LastName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Customer.BillingAddress.StreetAddress1, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.BillingAddress.StreetAddress1, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.BillingAddress.StreetAddress1, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Customer.BillingAddress.StreetAddress2, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.BillingAddress.StreetAddress2, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.BillingAddress.StreetAddress2, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Customer.BillingAddress.City, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.BillingAddress.City, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.BillingAddress.City, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Customer.BillingAddress.StateCode, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.BillingAddress.StateCode, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.BillingAddress.StateCode, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Customer.BillingAddress.Country, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.BillingAddress.Country, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.BillingAddress.Country, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Customer.BillingAddress.ZipCode, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Customer.BillingAddress.ZipCode, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Customer.BillingAddress.ZipCode, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.CreditCard.CreditCardNumber, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.CreditCard.CreditCardNumber, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.CreditCard.CreditCardNumber, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.CreditCard.ExpirationDate, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.CreditCard.ExpirationDate, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.CreditCard.ExpirationDate, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.CreditCard.Issuer, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.CreditCard.Issuer, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.CreditCard.Issuer, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Payment.Amount, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Payment.Amount, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Payment.Amount, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Payment.Cvv, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Payment.Cvv, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Payment.Cvv, "", new { #class = "text-danger" })
</div>
</div>
<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>
Simple answer: You can't send complex datatypes in a form.
For your given example, you can just send "StreetAddress1" as a string (alongside with "FirstName" and "LastName") and build the Customer object in your controller.
Code for your view:
#model Customer
<div>
#using (Html.BeginForm("Action", "Controller", FormMethod.Post))
{
#Html.TextBoxFor(m => m.FirstName)<br />
#Html.TextBoxFor(m => m.LastName)<br />
#Html.TextBoxFor(m => m.BillingAddress)<br />
<button type="submit">Save</button>
}
</div>
If you follow this approach, MVC already serializes the Customer object for you:
[HttpPost]
public ActionResult Action(Customer c)
{
string FullName = c.FirstName + " " + c.LastName
}
Use FormCollection Class in You Controller .. This Will Get You All The Posted Values From Use .. Then u Can Extract Values By Key FromCollection Keys .. Create New Object Based On The Value You Got From The FormCollection , Simply Add a FromCollection Parameter
public ActionResult (FormCollection F)
{
}
I am trying to populate a dropdownlist and then post it to db but for some reason it is giving error, please advice.
Controller
public class StudentController : BaseController
{
private List<SelectListItem> _gendersList;
[HttpGet]
public ActionResult Create()
{
var model = new CreateStudent();
_gendersList = new List<SelectListItem>()
{
new SelectListItem { Text = Constants.Gender.Boy, Value = Constants.Gender.Boy},
new SelectListItem { Text = Constants.Gender.Girl, Value = Constants.Gender.Girl},
};
model.Genders = _gendersList;
return View(model);
}
[HttpPost]
public ActionResult Create(CreateStudent student)
{
var result = true;
_gendersList = new List<SelectListItem>()
{
new SelectListItem { Text = Constants.Gender.Boy, Value = Constants.Gender.Boy},
new SelectListItem { Text = Constants.Gender.Girl, Value = Constants.Gender.Girl},
};
if (ModelState.IsValid)
{
result = _student.Insert(mappedStudent);
if (result)
{
return RedirectToAction("Index");
}
else
{
TempData["Message"] = "Failed to create new student";
return View();
}
}
return View("Create");
}
}
View
#model CreateStudent
#{
ViewBag.Title = "Create";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<script src="~/Scripts/jquery-3.1.1.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<h2>Create</h2>
#{
if (TempData["Message"] != null)
{
<h3>
#TempData["Message"].ToString()
</h3>
}
}
#{
}
#using (Html.BeginForm("Create","Student",FormMethod.Post))
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Student</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.FirstName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-4">
#Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.FirstName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.MiddleName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-4">
#Html.EditorFor(model => model.MiddleName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.MiddleName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.LastName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-4">
#Html.EditorFor(model => model.LastName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.LastName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Gender, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#*#Html.DropDownListFor(o=>o.Gender,Model.StudentGender, "", new { #class = "form-control" })*#
#Html.DropDownListFor(o=>o.Gender,(List<SelectListItem>)Model.Genders,"1", new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.Gender, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.IdNo, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.IdNo, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.IdNo, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.SchoolIdNo, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.SchoolIdNo, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.SchoolIdNo, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.ServiceType, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.ServiceType, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.ServiceType, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Comments, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Comments, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Comments, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.IsEnabled, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.IsEnabled)
#Html.ValidationMessageFor(model => model.IsEnabled, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.FirstNameAr, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.FirstNameAr, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.FirstNameAr, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.MiddleNameAr, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.MiddleNameAr, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.MiddleNameAr, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.LastNameAr, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.LastNameAr, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.LastNameAr, "", 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-primary" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
Your view is strongly typed to a CreateStudent class and the view code is using Model.Genders collection property when you use the DropDownListFor helper method. But in your http post action, you are calling the return View() method without passing a valid CreateStudent object and in another case without populating the Genders property. So when razor executes the view code, the model value is null ( because you did not pass anything to the view)
You need to set the Genders property again before returning the posted view model back to the view.
[HttpPost]
public ActionResult Create(CreateStudent student)
{
var genderList = new List<SelectListItem>()
{
new SelectListItem { Text = Constants.Gender.Boy, Value = Constants.Gender.Boy},
new SelectListItem { Text = Constants.Gender.Girl, Value = Constants.Gender.Girl},
};
if (ModelState.IsValid)
{
var result = _student.Insert(mappedStudent);
if (result)
{
return RedirectToAction("Index");
}
else
{
student.Genders = genderList;
TempData["Message"] = "Failed to create new student";
return View(student); // Passing the object here to view
}
}
//Model validation fails. Return the same view
student.Genders = genderList;
return View(student);
}
}
Also there no need for an extra casting. Model.Genders is of type List<SelectListItem>
#Html.DropDownListFor(o=>o.Gender,Model.Genders, new { #class = "form-control" })
I would want to insert multiple entries in my table called 'sibling' using it's Create Method (which I generated automatically using Scaffolding methods). I already made the form dynamic in adding the fields. However, when I click on the Submit button it only gets the first entry.
I sort of have an idea by implementing 'foreach' in the said method but I can't seem to find an answer that is spot on. Especially for my case I just want to modify the Create Method for 'sibling' which was generated automatically (if there is such a way without having to create a new method - but if not I am fine with a different approach as well).
This is my SiblingController:
public ActionResult Create(int id)
{
var sib = new sibling();
sib.child_id = id;
return View(sib);
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create([Bind(Include = "sibling_id,child_id,age,gender")] sibling sibling)
{
if (ModelState.IsValid)
{
db.siblings.Add(sibling);
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.child_id = new SelectList(db.children, "child_id", "last_name", sibling.child_id);
return View(sibling);
}
This is my Create.cshtml for Sibling:
#model dummyApp.Schema.TestModels.sibling
#{
ViewBag.Title = "Create";
}
#section Scripts{
<script type="text/javascript">
//Coding
$("#numBox").change(function () {
var htmlString = "";
var len = $(this).val();
for (var i = 0; i < len; i++) {
htmlString += ' <div class="form-group">\
#Html.LabelFor(model => model.child_id, "child_id", htmlAttributes: new { #class = "control-label col-md-2" })\
<div class="col-md-10">\
#Html.EditorFor(model => model.child_id, new { htmlAttributes = new { #class = "form-control" }})\
#Html.ValidationMessageFor(model => model.child_id, "", new { #class = "text-danger" })\
</div>\
</div>\
<div class="form-group">\
#Html.LabelFor(model => model.age, htmlAttributes: new { #class = "control-label col-md-2" })\
<div class="col-md-10">\
#Html.EditorFor(model => model.age, new { htmlAttributes = new { #class = "form-control" } })\
#Html.ValidationMessageFor(model => model.age, "", new { #class = "text-danger" })\
</div>\
</div>\
<div class="form-group">\
#Html.LabelFor(model => model.gender, htmlAttributes: new { #class = "control-label col-md-2" })\
<div class="col-md-10">\
#Html.EditorFor(model => model.gender, new { htmlAttributes = new { #class = "form-control" } })\
#Html.ValidationMessageFor(model => model.gender, "", new { #class = "text-danger" })\
</div>\
</div>\
';
}
$("#adtnl_fields").html(htmlString);
})
</script>
}
<h2>Create</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>sibling</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<!--
<div class="form-group">
#Html.LabelFor(model => model.sibling_id, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.sibling_id, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.sibling_id, "", new { #class = "text-danger" })
</div>
</div>
-->
<div class="form-group">
#Html.Label("Number of Siblings:", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<input type="number" id="numBox" class="form-control"/>
</div>
</div>
<!--
<div class="form-group">
#Html.LabelFor(model => model.child_id, "child_id", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#*Html.DropDownList("child_id", null, htmlAttributes: new { #class = "form-control" })*#
#Html.EditorFor(model => model.child_id, new { htmlAttributes = new { #class = "form-control" }})
#Html.ValidationMessageFor(model => model.child_id, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.age, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.age, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.age, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.gender, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.gender, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.gender, "", new { #class = "text-danger" })
</div>
</div>
-->
<!-- Div for additional fields -->
<div id="adtnl_fields">
</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>
This is my 'sibling.cs':
public partial class sibling
{
public int sibling_id { get; set; }
public int child_id { get; set; }
public Nullable<int> age { get; set; }
public string gender { get; set; }
public virtual child child { get; set; }
}
Please help. Thank you!
You can use AddRange method in EF-6
IList<Student> newStudents = new List<Student>();
newStudents.Add(new Student() { StudentName = "Student1 by addrange" });
newStudents.Add(new Student() { StudentName = "Student2 by addrange" });
newStudents.Add(new Student() { StudentName = "Student3 by addrange" });
using (var context = new SchoolDBEntities())
{
context.Students.AddRange(newStudents);
context.SaveChanges();
}