I have a Strongly Types Partial View that I am trying to render from another Partial View
#{ Html.RenderPartial("Days", Model.DaysOpen, new ViewDataDictionary()); }
I have been folling advice based on the below
ASP.NET MVC, strongly typed views, partial view parameters glitch
It allows me to create the parent(Centre) but does not create the Child (owned) Days entity.
Can anyone offer any advice
Details.cshtml
#model RCCMS.ObjectModel.Entities.Centre
#using (Html.BeginForm(null, null, FormMethod.Post, new { #class = "form-horizontal", Role = "form" }))
{
#Html.ValidationSummary("Please correct the following errors:-")
<div id="HiddenFields">
#Html.HiddenFor(m => m.RowVersion)
</div>
<fieldset>
<div class="form-group">
#Html.LabelFor(model => model.Name, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Name, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Name, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Address1, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Address1, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Address1, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Address2, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Address2, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Address2, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Address3, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Address3, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Address3, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Town, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Town, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Town, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.County, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.County, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.County, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Postcode, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Postcode, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Postcode, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Uprn, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Uprn, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Uprn, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Lunch, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.Lunch, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.Lunch, "*")
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.VoluntaryContribution, new { #class = "col-md-2 control-label" })
<div class="col-md-5">
#Html.TextBoxFor(model => model.VoluntaryContribution, new { #class = "form-control" })
</div>
<div class="col-md-1">
#Html.ValidationMessageFor(model => model.VoluntaryContribution, "*")
</div>
</div>
#{ Html.RenderPartial("Days", Model.DaysOpen, new ViewDataDictionary()); }
<div class="col-md-offset-2">
<input type="submit" name="submit" value="Save" class="btn btn-primary"/>
<input type="submit" id="cancel" name="submit" value="Cancel" class="btn"/>
</div>
</fieldset>
}
And my Partial View (Days)
#model RCCMS.ObjectModel.Entities.Days
<div class="form-group">
#Html.Label("Days Open", new {#class = "col-md-5 control-label"})
<div class="col-md-10">
<div class="checkbox-inline">
<label>
#Html.CheckBoxFor(m => m.Monday) Monday
#Html.ValidationMessageFor(m => m.Monday, "*")
</label>
</div>
<div class="checkbox-inline">
<label>
#Html.CheckBoxFor(m => m.Tuesday) Tuesday
#Html.ValidationMessageFor(m => m.Tuesday, "*")
</label>
</div>
<div class="checkbox-inline">
<label>
#Html.CheckBoxFor(m => m.Wednesday) Wednesday
#Html.ValidationMessageFor(m => m.Wednesday, "*")
</label>
</div>
<div class="checkbox-inline">
<label>
#Html.CheckBoxFor(m => m.Thursday) Thursday
#Html.ValidationMessageFor(m => m.Thursday, "*")
</label>
</div>
<div class="checkbox-inline">
<label>
#Html.CheckBoxFor(m => m.Friday) Friday
#Html.ValidationMessageFor(m => m.Friday, "*")
</label>
</div>
<div class="checkbox-inline">
<label>
#Html.CheckBoxFor(m => m.Saturday) Saturday
#Html.ValidationMessageFor(m => m.Saturday, "*")
</label>
</div>
<div class="checkbox-inline">
<label>
#Html.CheckBoxFor(m => m.Sunday) Sunday
#Html.ValidationMessageFor(m => m.Sunday, "*")
</label>
</div>
</div>
The create action of the CentreController
public ActionResult Create()
{
if (!Security.HasPemission(Permission.CanCreateCentres)) return View("AccessDenied");
var model = new Centre();
return (IsAjax()) ? (ActionResult)PartialView("Details", model) : View(model);
}
Related
I am trying to do a simple modal in C# & ASP.NET MVC; I added 2 text boxes in a col-6 layout so they would be side by side I tried quiet a few different techniques and the only way I got it to work was if I did a table with a row and 2 cols in the row but they don’t came out the exact same size. So I'm trying to do the col-6 with bootstrap grid so they will be the same. In my Dev tools I see ::before and ::after maybe this has something to do with messing up the layout.
Here the 2 text boxes are in block layout 1 on top of each other
<div class="container-fluid mx-auto">
<div class="row d-inline">
<div class="col-6 d-inline">
<div class="form-group">
#Html.LabelFor(x => x.PartVM.PartNumber, htmlAttributes: new { #class = "control-label" })
<div class="">
#Html.TextBoxFor(x => x.PartVM.PartNumber, new { #class = "form-control", #readonly = "readonly" })
#Html.ValidationMessageFor(x => x.PartVM.PartNumber, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col-6 d-inline">
<div class="form-group">
#Html.LabelFor(x => x.PartVM.DateEntered, htmlAttributes: new { #class = "control-label" })
<div class="">
#Html.TextBoxFor(x => x.PartVM.DateEntered, new { #class = "form-control", #readonly = "readonly" })
#Html.ValidationMessageFor(x => x.PartVM.DateEntered, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
</div>
How can I use the bootstrap grid so they come out the same size and on the same row?
You should just be able to use col instead of col-6. Also, using the form-inline might help. There are a lot of things you can do to format your form how you want it using Bootstrap . Also, Bootstrap uses #media breakpoints, which changes the layout based on the screen size.
<form class="form-inline">
<div class="container-fluid mx-auto">
<div class="row d-inline">
<div class="col d-inline">
<div class="form-group">
#Html.LabelFor(x => x.PartVM.PartNumber, htmlAttributes: new { #class = "control-label" })
<div class="">
#Html.TextBoxFor(x => x.PartVM.PartNumber, new { #class = "form-control", #readonly = "readonly" })
#Html.ValidationMessageFor(x => x.PartVM.PartNumber, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col d-inline">
<div class="form-group">
#Html.LabelFor(x => x.PartVM.DateEntered, htmlAttributes: new { #class = "control-label" })
<div class="">
#Html.TextBoxFor(x => x.PartVM.DateEntered, new { #class = "form-control", #readonly = "readonly" })
#Html.ValidationMessageFor(x => x.PartVM.DateEntered, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
</div>
</form>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<h4>Send your comments.</h4>
<hr />
<div class="form-group">
#Html.LabelFor(m => m.FromName, new { #class = "col-md-2 control-label" })
<div class="col-md-10">
#Html.TextBoxFor(m => m.FromName, new { #class = "form-control" })
#Html.ValidationMessageFor(m => m.FromName)
</div>
</div>
<div class="clearfix"></div>
<div class="form-group">
#Html.LabelFor(m => m.FromEmail, new { #class = "col-md-2 control-label" })
<div class="col-md-10">
#Html.TextBoxFor(m => m.FromEmail, new { #class = "form-control" })
#Html.ValidationMessageFor(m => m.FromEmail)
</div>
</div>
<div class="clearfix"></div>
<div class="form-group">
#Html.LabelFor(m => m.Message, new { #class = "col-md-2 control-label" })
<div class="col-md-10">
#Html.TextBoxFor(m => m.Message, new { #class = "form-control" })
#Html.ValidationMessageFor(m => m.Message)
</div>
</div>
<div class="clearfix"></div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" class="btn btn-default" value="Send" />
</div>
</div>
}
I have tried using clearfix, as well as modifying the css margins in form-group. If anyone has any suggestions, feel free. Program works perfectly, just the formatting that is off.
You seem to be using clearfix in the wrong place?
Just add it along side form-group
<div class="form-group clearfix">
Try either one will solve the problem.
Add the class form-horizontal to the form
or
Add the class row to the <div class="form-group">
I have question in regarding how to add parameter see my codes below:
[HttpPost]
[ValidateAntiForgeryToken]
public IActionResult Edit(Employee emp)
{
try
{
Employee updateEmp = _Context.Employee.FirstOrDefault(c => c.Idemployee == emp.Idemployee);
updateEmp.Address = emp.Address;
updateEmp.Age = emp.Age;
updateEmp.ContactNumber = emp.ContactNumber;
updateEmp.FullName = emp.FullName;
updateEmp.Gender = emp.Gender;
updateEmp.IsActive = emp.IsActive;
_Context.Employee.Update(updateEmp);
_Context.SaveChanges();
return RedirectToAction("Index");
}
catch (Exception)
{
throw;
}
}
What I am trying to do here is I am trying to extract the emp.Idemployee from the querystring but it couldn't and redirect me to the error null exception.
I am using a model to extract the details form the cshtml.
public IActionResult Edit(int id)
{
var editEmployee = _Context.Employee.FirstOrDefault(c => c.Idemployee == id);
return View(editEmployee);
}
I don't know whats wrong with it but all of the other information are extracted except for Idemployee.
#model Demo101.DAL.Entities.Models.Employee
#{
ViewBag.Title = "Edit Employee";
}
<h2>#ViewData["Title"]</h2>
<form asp-controller="Employee" asp-action="Edit" method="post" class="form-horizontal" role="form">
<div class="form-horizontal">
<div asp-validation-summary="All" class="text-danger"></div>
<!--FullName-->
<label asp-for="Idemployee" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.LabelFor(model => model.Idemployee, new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.Idemployee)
</div>
<!--FullName-->
<label asp-for="FullName" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.TextBoxFor(model => model.FullName, new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.FullName)
</div>
<!--Age-->
<label asp-for="Age" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.TextBoxFor(model => model.Age, new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.Age)
</div>
<!--ContactNumber-->
<label asp-for="ContactNumber" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.TextBoxFor(model => model.ContactNumber, new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.ContactNumber)
</div>
<!--Address-->
<label asp-for="Address" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.TextBoxFor(model => model.Address, new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.Address)
</div>
<!--Gender-->
<label asp-for="Gender" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.TextBoxFor(model => model.Gender, new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.Gender)
</div>
<!--IsActive-->
<label asp-for="IsActive" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.CheckBoxFor(model => model.IsActive, new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.IsActive)
</div>
<!--Create Button-->
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Edit Employee" class="btn btn-default" />
</div>
</div>
</form>
Thanks!
Look at my code below, give this a go
<!--IdEmployee-->
<label asp-for="Idemployee" class="col-md-2 control-label"></label>
<div class="col-md-10">
#Html.LabelFor(model => model.Idemployee, new { #class = "form-control" })
#Html.HiddenFor(model => model.Idemployee)
#Html.ValidationMessageFor(model => model.Idemployee)
</div>
Your view does not contain any field with Employee value. You have label, you have validation message, but not value itself. Thus, you have no value in POST to server.
Add somewhere inside form:
#Html.HiddenFor(model => model.Idemployee)
I'm currently looking for this, i have a modal that contains some textbox, user have to fill them and then i'd like to save the information inside a collection in mongo. A class ConnectionHandler.cs is used to connect to database and we are using mongoentities. So i have this :
using MongoDB.Driver;
using Project.My.Core.Entities.MongoEntities;
namespace Project.My.Core
{
public class ConnectionHandler<T> where T : IMongoEntity
{
public MongoCollection<T> MongoCollection { get; private set; }
public ConnectionHandler()
{
var connectionString = "mongodb://localhost";
//// Acceder à la chaine de connection
var mongoClient = new MongoClient(connectionString);
//// Acceder au serveur
var mongoServer = mongoClient.GetServer();
//// Acceder à la BD
const string databaseName = "MyDB";
var db = mongoServer.GetDatabase(databaseName);
//// Acceder aux collection la BD (tables en langage relationnel...)
MongoCollection = db.GetCollection<T>(typeof(T).Name);
}
}
}
My modal content is inside a partial view like this :
#using Project.My.Web.Administration.Models
#model GarantieViewModel
<div id ="userinput" class="form-panel-modify">
<div class="form-horizontal style-form">
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.NomUser, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.UserInformationViewModel.NomUser, new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.PrenomUser, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.UserInformationViewModel.PrenomUser, new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.EntrepriseUser, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.UserInformationViewModel.EntrepriseUser, new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.EmailUser, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.UserInformationViewModel.EmailUser, new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.TelephoneUser, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.UserInformationViewModel.TelephoneUser, new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.whoareyou, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.EnumDropDownListFor(m => m.UserInformationViewModel.whoareyou, new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.mutuelle45, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.EnumDropDownListFor(m => m.UserInformationViewModel.mutuelle45, new { #class = "form-control" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(m => m.UserInformationViewModel.NumeroOrias, new { #class = "col-sm-d col-sm-3 control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.UserInformationViewModel.NumeroOrias, new { #class = "form-control" })
</div>
</div>
</div>
</div>
<div style="margin-top:50px;">
<input type="submit" disabled="true" class="btn btn-default" style="color: #ffffff;background-color:#48bcb4;border-color: #48bcb4;">
</div>
And finally my modal is here :
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content" style="height:650px;width:600px;text-align:center">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Informations</h4>
<p><b>Pour lancer la comparaison vous devez d'abord renseigner vos informations</b></p>
</div>
#Html.Partial("_ModalContent")
</div>
</div>
</div>
So, after looking everywhere i can't do what i want. I just want the information of my modal content to go inside a collection named "UserInformation" for example.
If someone could help with this it would be great ! Thanks.
I Have the following form on a view
#using (Html.BeginForm("AddInterest", "Club", FormMethod.Post))
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
<div class="row">
<div class="col-md-8">
<div class="well bs-component">
<div class="form-group">
<div class="col-md-10 col-md-offset-1">
<h3>Not listed? - Add extras here</h3>
</div>
</div>
#Html.HiddenFor(model => model.ClubTypeId)
#Html.HiddenFor(model => model.ClubId)
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
<div class="row col-md-offset-1 col-md-11">
<div class="col-md-4">
#Html.LabelFor(model => model.InterestName, htmlAttributes: new { #class = "control-label" })
#Html.EditorFor(model => model.InterestName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.InterestName, "", new { #class = "text-danger" })
</div>
<div class="col-md-5">
#Html.LabelFor(model => model.Description, htmlAttributes: new { #class = "control-label" })
#Html.EditorFor(model => model.Description, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Description, "", new { #class = "text-danger" })
</div>
<input type="submit" value="Add" class="btn btn- success" />
</div>
</div>
</div>
</div>
</div>
</div>
}
Everything is good apart from the submit button sits inline horizontally with the labels not the editor boxes, how can I get it to drop down?
i.e.
Label Label
Text Box Text Box Button
NOT
Label Label Button
Text Box Text Box
Its currently showing like this:
You should recreate your form following this pattern:
<div class="form-group">
#Html.LabelFor(model => model.InterestName, htmlAttributes: new { #class = "col-md-4 control-label" })
<div class="col-md-8">
#Html.EditorFor(model => model.InterestName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.InterestName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Description, htmlAttributes: new { #class = "col-md-4 control-label" })
<div class="col-md-8">
#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">
<div class="col-md-offset-4 col-md-8">
<input type="submit" value="Add" class="btn btn-success" />
</div>
</div>
More information at http://getbootstrap.com/css/#forms-horizontal
Edit
If you want them inline vertically:
<form class="form-inline">
<div class="form-group">
#Html.LabelFor(model => model.InterestName)
#Html.EditorFor(model => model.InterestName, new { htmlAttributes = new { #class = "form-control" } })
</div>
<div class="form-group">
#Html.LabelFor(model => model.Description)
#Html.EditorFor(model => model.Description, new { htmlAttributes = new { #class = "form-control" } })
</div>
<input type="submit" value="Add" class="btn btn-success" />
</form>
More information at http://getbootstrap.com/css/#forms-inline
Edit 2
If you want them inline horizontally but in two columns and submit button aligned to the right:
<form>
<div class="col-md-4">
<div class="form-group">
#Html.LabelFor(model => model.InterestName)
#Html.EditorFor(model => model.InterestName, new { htmlAttributes = new { #class = "form-control" } })
</div>
</div>
<div class="col-md-4">
<div class="form-group">
#Html.LabelFor(model => model.Description)
#Html.EditorFor(model => model.Description, new { htmlAttributes = new { #class = "form-control" } })
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<button type="submit" class="btn btn-default" style="margin-top: 25px;">Add</button>
</div>
</div>
</form>