The checkbox is not displaying in page. I tried many solutions in google. Nothing worked. Here s the code:
#model project.gamestatus
#using (Html.BeginForm("Create", "Calculator", FormMethod.Post, new { id = "frmID" }))
{
//other codes
<div class="form-group">
#Html.Label("Show on Screen", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.CheckBoxFor(m => m.display_status)
#Html.ValidationMessageFor(model => model.display_status, "", 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-info" />
</div>
</div>
}
Only if the checkbox is shown in page i can proceed with validation. In my view there is no checkbox
First of all, you need to ensure that the display_status model is of boolean type and assigned the display name to it along with any validation.
[Display(Name="CheckBox Display Name")]
[Required]
public bool display_status { get; set; }
Also, #Html.CheckBoxFor do not support the label of checkbox. Therefore, you can have the label of the checkbox using #Html.LabelFor as follow:
<div class="form-group">
#Html.Label("Show on Screen", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.CheckBoxFor(m => m.display_status)
#Html.LabelFor(m => m.display_status)
#Html.ValidationMessageFor(m => m.display_status, "", new { #class = "text-danger" })
</div>
</div>
though its a very old post but I undergo this issue todat, but when I inspected I found that the CSS property opacity was set to 0 so changing it to 1 will solve the issue
#Html.EditorFor(model => model.Active, new { htmlAttributes = new { style = "opacity: 1" } })
I fixed the problem by setting the height to 20px explicitly. When I examined the page, it was being set to 20%:
#Html.CheckBoxFor(m => m.ExistingUser, new { style="height:20px" })
Related
I want to create multi-language system using MVC (English and Arabic) , I want to use one view for both languages , i created the Login view based on the following model :
public partial class WEBSITE_USERS
{
[DisplayName("ID / Iqamam No - رقم الهوية او الاقامة")]
[Required(ErrorMessage ="This field is required يجب ادخال رقم الهوية المسجل في الملف الطبي ")]
public string ID_NO { get; set; }
[DisplayName("Mobile No - رقم الجوال")]
[Required(ErrorMessage = "Mobile No is required - يجب ادخال رقم الجوال المسجل في الملف ")]
public string MOBILE { get; set; }
[DisplayName("Medical Record No - رقم الملف")]
[Required(ErrorMessage = "File No is required يجب ادخال رقم الملف الطبي ")]
}
Now the DisplayName appeared on left side ,
How can i show the English label on left side and Arabic label on right side of editor to show like this for example :
ID/Iqama No ----------------- رقم الهوية او الاقامة
Now its appear all in left side like this :
ID / Iqamam No - رقم الهوية او الاقامة ---------------------------
this is the view code
#model kaashtaif.Models.WEBSITE_USERS
#{
ViewBag.Title = "Login Window - شاشة تسجيل الدخول";
}
<h2>Login</h2>
#using (Html.BeginForm("Authorise","Login",FormMethod.Post))
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.ID_NO, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.ID_NO, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.ID_NO, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.MOBILE, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.MOBILE, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.MOBILE, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.PATIENT_NO, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.PATIENT_NO, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.PATIENT_NO, "", new { #class = "text-danger" })
</div>
</div>
<div class="col-md-10">
<label>#Html.DisplayFor(model => model.LoginErrorMessage)</label>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Login" class="btn btn-default" />
<input type="reset" name="name" value="Clear" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
and this is screen shot of view
Fastest way of doing it is changing your markup and manually using Html.DisplayNameFor() then split that string up.
Repeat this process for the rest of the input fields/ form-group.
<div class="form-group">
<div class="col-md-3">
#Html.DisplayNameFor(x => x.ID_NO).ToString().Split('-')[0]
</div>
<div class="col-md-6">
#Html.EditorFor(model => model.ID_NO, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.ID_NO, "", new { #class = "text-danger" })
</div>
<div class="col-md-3">
#Html.DisplayNameFor(x => x.ID_NO).ToString().Split('-')[1]
</div>
</div>
What's happening here is we're getting the value of DisplayName attribute which is [DisplayName("ID / Iqamam No - رقم الهوية او الاقامة")] and since you have a delimiter which is a hyphen, we're splitting the string into two using that - or hyphen then displaying the string by index.
This question already has answers here:
Post an HTML Table to ADO.NET DataTable
(2 answers)
Closed 6 years ago.
i would like to get the list of checkboxes to the controller.
foreach (var item in Model.Billeder)
{
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(ModelItem => item.Overskrift, htmlAttributes: new { #class = "control-label col-md-2" }) #Html.DisplayFor(model => item.Overskrift)
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(ModelItem => item.Emailbool)
#Html.ValidationMessageFor(ModelItem => item.Emailbool, "", new { #class = "text-danger" })
</div>
</div>
</div>
}
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Send" class="btn btn-default" />
</div>
</div>
in tilbud i have a
public virtual ICollection<Billed> Billeder { get; set; }
i would like for it to come into the controller so i can sort them
public ActionResult MailTilbud(Tilbud tb)
The for-each loop wouldn't work because the checkbox element name wouldn't be properly created with index which would cause it to be not posted back in controller, so change it to use for loop :
for (int i=0 i <Model.Billeder.Count; i++)
{
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(ModelItem => Model.Billeder[i].Overskrift, htmlAttributes: new { #class = "control-label col-md-2" })
#Html.DisplayFor(model => Model.Billeder[i].Overskrift)
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(ModelItem => Model.Billeder[i].Emailbool)
#Html.ValidationMessageFor(ModelItem => Model.Billeder[i].Emailbool, "", new { #class = "text-danger" })
</div>
</div>
</div>
}
and you would need to modify your model to have IList<T>, as ICollection<T> does not have indexing support.
public virtual IList<Billed> Billeder { get; set; }
and if the above property is in your model which is mapped to a table using Entity Framework, then you would need to create ViewModel class specific to view instead of modifying the DTO model.
I have a view that contains 2 partial views.
#model ListViewModel
....
#{
Html.RenderPartial("EditCartItemsPartical");
Html.RenderPartial("ShowProductINFO", Model.Products);
}
and I just want to create a from with the first partial, and a list with the second.
The partial views
EditCartItemsPartical.cshtml
#model TestNewATM3._0.Models.CartItem
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<div class="form-group">
#Html.LabelFor(model => model.CartId, "CartId", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.CartId, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.CartId, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.ProductId, "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>
.... // more control for CartItem
<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>
}
ShowProductINFO.cshtml
#model IEnumerable<TestNewATM3._0.Models.AllProduct2>
<p>#Html.ActionLink("Create New", "Create")</p>
<table class="table">
<tr>
<th>ID</th>
<th>#Html.DisplayNameFor(model => model.Title)</th>
</tr>
#foreach (var item in Model) {
<tr>
<td>#Html.DisplayFor(model => item.Id)</td>
<td>#Html.DisplayFor(modelItem => item.Title)</td>
</tr>
}
</table>
And in my controller I got this.
public ActionResult Edit()
{
var db = ApplicationDbContext.Create();
var list = new ListViewModel
{
Products = db.AllProduct2s.ToList(),
Users = db.Users.ToList(),
Cart = db.Carts.ToList(),
CartItem = db.CartItems.ToList()
};
return View(list);
}
But the problem is that I cant show both partial at the same time because if I send the list in my view, then my first partial gets a problem cause it want a #model TestNewATM3.0.Models.CartItem. but if I don't sent the list My list wont show because I don't send it.
So how do i show a normal partial form view and a List partial view at the same time?
I'm having a little difficulty understanding your examples (i.e you have an edit view with create buttons), it looks like your trying to create a view to edit the cart.
Note: I would suggest renaming the CartItem property of your model to CartItems for clarity, but I'll use the current property names for the examples below.
You could render the partial view for each of the items in the list like so,
but this approach more is more than a little messy:
foreach(var cartItem in Models.CartItem){
Html.RenderPartial("EditCartItemsPartical", cartItem);
}
A simpler and more performant approach would be to edit the first view so it takes a collection of cart items
Like so
#model IEnumerable<TestNewATM3._0.Models.CartItem>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
#foreach(var modelItem in Model.CartItem){
<h4>CartItem</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => modelItem.CartId, "CartId", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => modelItem.CartId, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => modelItem.CartId, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.ProductId, "ProductId", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => modelItem.ProductId, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => modelItem.ProductId, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Aantal, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => modelItem.Aantal, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => modelItem.Aantal, "", 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>
}
Of course this will require you to change the server side code to receive a collection of cart items, but from the user's perspective not having to post a form back multiple times, to complete your changes is going to result in a better experience.
disclaimer: I changed the above view in notepad, might need to adjust a bit before it works perfectly
I hope this helps.
Using scaffolded items in an MVC5 application, I see things like text fields given the CSS class "form-control". The fields all have consistent rounded corners, same font color/size etc.
Now I've added a dropdown list using "#Html.DropdownListFor" and it's square, with a different font colour.
I know I can specify which CSS class to use in the Razor e.g.
#Html.DropDownListFor(model => model.OrderItemTypeId, (SelectList)ViewBag.OrderItemTypes, new { htmlAttributes = new { #class = "###########" } })
But I don't know what to replace ########### with. If I specify "form-control" just gives me the square box I described above. "form-control select" doesn't seem to do much either.
Here's a bigger snippet showing a well-styled text field directly above it
<div class="form-group">
#Html.LabelFor(model => model.Title, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Title, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Title, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.OrderItemTypeId, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.DropDownListFor(model => model.OrderItemTypeId, (SelectList)ViewBag.OrderItemTypes, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.OrderItemType, "", new { #class = "text-danger" })
</div>
</div>
Is there a value I can use that will give my dropdown the same appearance as all the other text fields I already have?
Thanks
The third parameter already is the htmlAttributes field, so your syntax is wrong. This is what you're after:
#Html.DropDownListFor(model => model.OrderItemTypeId,
(SelectList)ViewBag.OrderItemTypes,
new { #class = "form-control etc" })
See Microsoft Docs.
You need to make sure it sits within proper hierarchy of outer tags with their corresponding classes.
See the code below that I took from this article - How to use Bootstrap 3 validation states with ASP.NET MVC Forms
<div class="row">
<div class="col-sm-4 col-sm-offset-4">
<div class="panel panel-default">
<div class="panel-body">
#using (Html.BeginForm("UserProfile", "Profile", FormMethod.Post, new { role = "form", id="userForm" })) {
#* State selection dropdown *#
<div class="form-group">
#Html.LabelFor(m => m.State)
#Html.DropDownListFor(m => m.State, // Store selected value in Model.State
// This argument needs some explanation - here we take a Distionary<string, string>
// and turn it into an instance of SelectList, see blog post for more details
new SelectList(Model.States, "Key", "Value"),
// Text for the first 'default' option
"- Please select your state -",
// A class name to put on the "<select>"
new { #class = "form-control" }
)
#Html.ValidationMessageFor(m => m.State)
</div>
<button type="submit" class="btn btn-primary">Update</button>
}
</div>
</div>
</div>
</div>
This question already has answers here:
how to create a view with multiple models mvc 4?
(2 answers)
Closed 7 years ago.
I've been trying to dissect an automated MVC view & controller, and modify it so that i can insert information from a form in the view, on to two separate database tables (Entity framework database first).
here's what i have so far. it works if i reference either of the namespaces at the top on their own, but not together?
#model manage.mysite.DataModels.Property_Type
#model manage.mysite.DataModels.Room_Type
#{
ViewBag.Title = "Create";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
<div class="form-horizontal">
<h4>Property_Type</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.PropertyType, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.PropertyType, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.PropertyType, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.RoomType, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.RoomType, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.RoomType, "", 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>
}
It is not possible to reference several models in a View.
However, you can create composite model, which has the two other models as properties.
As such:
using manage.mysite.DataModels;
namespace manage.mysite.ViewModels
{
public class FooViewModel
{
public Property_Type PropertyType { get; set; }
public Room_Type RoomType { get; set; }
}
}
And then serve this model instead.
#model manage.mysite.ViewModels.FooViewModel
#{
ViewBag.Title = "Create";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
<div class="form-horizontal">
<h4>Property_Type</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.PropertyType.PropertyType, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.PropertyType.PropertyType, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.PropertyType.PropertyType, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.RoomType.RoomType, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.RoomType.RoomType, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.RoomType.RoomType, "", 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>
}
See also:
MVC Multiple Models in One View
how to create a view with multiple models mvc 4?
Which is the best way to use multiple models with sames properties and using a unique view?