In my MVC 5 Razor view, I created a hidden field, like this:
#Html.HiddenFor(x => x.FormData.UserId,
new { ng_model = "selectedEmployee.userId" })
When I perform the necessary angular action to fill the selectedEmployee.userId property, the hidden input's value is not filled.
But, when I change it to
#Html.TextBoxFor(x => x.FormData.UserId,
new { ng_model = "selectedEmployee.userId" })
It's working and the data is posted to the server.
And
<input type="hidden" name="FormData.UserId" value="{{selectedEmployee.userId}}">
is working, but
#Html.HiddenFor(x => x.FormData.UserId,
new { value = "{{selectedEmployee.userId}}" })
is not. (which probably has to do with Razor overwriting the HTML value)
What's the reason that in Razor a hidden input with an ng-model is not working?
Please change value into ng_value
#Html.HiddenFor(x => x.FormData.UserId,
new { ng_value = "{{selectedEmployee.userId}}" })
Here is how to assign a value to Hidden field. 'V' character of value attribute must be Capital letter.
<div data-ng-controller="MyFunction">
#{Html.BeginForm("SchoolMedium", "BasicSetup", FormMethod.Post, new { });
#Html.HiddenFor(s => s.SchoolMediumId, new { Value = "{{mascotmedium.SchoolMediumId}}" });
Html.EndForm();
}
and in controller
$scope.EditWhenAdded= function(row){
$scope.mascotmedium = row.entity;
};
Related
I have nullable Boolean value that is being presented as a checkbox using the following code:
#Html.EditorFor(m => m.IsInitialStatus, new { htmlAttributes = new { #onclick = "InitialOrStarting()" } })
however the #onclick attribute is not being added to the HTML when the page is loaded. Am I missing something here? I had taken the example from an answer on this page.
I have also looked at changing this to a CheckBoxFor but keep getting an issue with the nullable Bool datatypes.
Any help on this would be appreciated! I just want a nullable bool checkbox with an onClick event firing to a Javascript function... I am not the most advanced user but this seems to be more difficult for me to do than maybe it should!?
EDIT
There appears to be an EditorTemplate for Boolean which contains:
#model bool?
#Html.CheckBox("", Model.GetValueOrDefault())
You are using the overload of EditorFor() where the 2nd parameter is additionalViewData. If you did not have a specific EditorTemplate for bool?, the method would generate the default template, which is a <select> with 3 values for null, true and false, and include the attributes.
But because you have an EditorTemplate, you need to add the attributes yourself by reading the value from the ViewDataDictionary (typically, an EditorTemplate includes multiple html elements, so the method cannot know which element you want to apply the attributes to).
Your template would need to be
#model bool?
#{ var attributes = ViewData["htmlAttributes"]; }
#Html.CheckBox("", Model.GetValueOrDefault(), attributes)
Having said that, your should not be doing this. A bool? has 3 states (null, true or false) but a checkbox has only 2 states - on or off (translates to true or false) so your EditorTemplate does not represent the possible values of your property.
If you only want to allow true or false, then your property should not be nullable. Alternatively, use the default template that does allow a null selection (or if you want an alternative UI, create a template that renders 3 radio buttons for example)
In addition, I recommend you stop polluting you markup with behavior and use Unobtrusive JavaScript - i.e. your script will be
$(yourCheckBox).click(function() {
... // do something
});
Onclick Event does not working for #HtmlEditorFor. But you can use class attribute.
<script>
$(".single-checkbox").on("change", function () {
if ($(".single-checkbox:checked").length > 2) {
this.checked = false;
alert ("Only 2 choice")
}
});
</script>
#Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { #class = "single-checkbox" } })
#Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { #class = "single-checkbox" } })
#Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { #class = "single-checkbox" } })
#Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { #class = "single-checkbox" } })
I have an MVC 5 project and we are creating radio buttons from database records.
It works fine below but there has to be a way to NOT have the if check in there and either append the checked after the fact or even before.
As shown below, the only difference between the 2 radio button creations is: new { #checked = "checked" }
#{
foreach (var item in Model.PaintColor)
{
if (item.DefaultChoice == true)
{
#Html.RadioButtonFor(m => m.pledge.PaintColorId,
item.ColorId.ToString(),
new { #checked = "checked" }
)
}
else
{
#Html.RadioButtonFor(m => m.pledge.PaintColorId,
item.ColorId.ToString()
)
}
#Html.Label("Color" + item.ColorId, item.ColorDesc)
}
<br />
}
See comments from Stephen regarding fixing this. Basically setting it as checked as not required as since it checks the value that it is being bound to.
When the view model is initially created I set the field value to the Default value and the radio button is set as checked.
foreach (var item in Model.PaintColor)
{
var idVal = string.Format("PaintColor_{0}", item.ColorId);
<div>
<label>
#Html.RadioButtonFor(m => m.pledge.PaintColorId,
item.ColorId,
new { id = string.Format("Rb{0}", idVal) }
)
<span>#item.Description</span>
</label>
Currently i have this field on a form:
#Html.EditorFor(model => model.AmountDecimal,
new { htmlAttributes = new { #class = "form-control" } })
But:
a) i want it to have the value "100" predefined
b) don't want it to be editable
I know how to do it in raw HTML but i need it to be in razor.
Thanks
It would make sense to set this value e.g. in the constructor of your model or in the controller before you call your view
public ActionResult MyAction()
{
var model = new MyViewModel
{
AmountDecimal= 100
};
return View(model);
}
But if you really like to do it in razor, you may use HiddenFor
#Html.HiddenFor(model => model.AmountDecimal, new { #Value = "100" });
<input type="text" name = "dummy" class="form-control" value="100" readonly/>
Keep in mind to never trust a user input ;)
I think your are loooking for something like this:
#Html.EditorFor(model => model.AmountDecimal,
new { htmlAttributes = new { #class = "form-control", #Value = "100", #readonly = "readonly"} })
I have an ASP.NET MVC 4 site and a domain model that uses an Enum. I'm able to generate a list of SelectListItem objects, but the proper item is not selected.
Domain Model
public enum ApplicationStatus
{
Unknown = 0,
Incomplete = 1,
Submitted = 2,
Error = 4
}
public class Application
{
public ApplicationStatus Status { get; set; }
// ...
}
The "Edit" View
#model Application
#using (Html.BeginForm("Edit", "Applications", new { ... }, FormMethod.Post, new { role = "form", #class = "form-horizontal" }))
{
#Html.Partial("_Form", Model)
<p>
#Html.ActionLink("Cancel", "Details", new { ... }, new { #class = "btn btn-default" })
<button type="submit" class="btn btn-primary">Save</button>
</p>
}
The "_Form" Partial
#model BWE.Models.Entity.BitWeb.Application
#Html.ValidationSummary(true)
<div class="form-group">
#Html.LabelFor(model => model.Status, new { #class = "col-sm-2" })
<div class="col-sm-10">
#Html.DropDownListFor(model => model.Status, SelectHelper.GetApplicationStatusOptions(Model.Status))
#Html.ValidationMessageFor(model => model.Status)
</div>
</div>
SelectHelper
public static class SelectHelper
{
public static IEnumerable<SelectListItem> GetApplicationStatusOptions(ApplicationStatus currentStatus)
{
var items = new List<SelectListItem>()
{
new SelectListItem()
{
Text = "Select",
Value = string.Empty
}
};
IEnumerable<ApplicationStatus> statuses = Enum.GetValues(typeof(ApplicationStatus)).Cast<ApplicationStatus>();
foreach (var status in statuses)
{
if (status == ApplicationStatus.Unknown)
continue;
items.Add(new SelectListItem()
{
Text = status.ToString(),
Value = ((int)status).ToString(),
Selected = status == currentStatus
});
}
return items;
}
}
The "Select" option is always selected in the dropdown even though I can step through the code and see one of the SelectListItem objects get their Selected property set to true.
I've tried the solution recommended in My templated helper using a DropDownListFor does NOT reflect the model of enum. Why?, but this solution was geared towards MVC 3. I tried the solution (passing a SelectList object as the second argument to Html.DropDownListFor) and all I got was a dropdown list with 4 options whose display text was "System.Web.Mvc.SelectListItem" and no values for the <option> tags.
Furthermore, I tried other solutions that created an #Html.EnumDropDownListFor(...) helper function, which behaved the same way. It seems that all though the proper SelectListItem is getting selected, maybe the current Model.Status value is overriding it?
Update #1
I added an integer property called StatusId which gets and sets the Status property as an integer, and this works when calling Html.DropDownListFor(model => model.StatusId, ...) however I was hoping for a solution that allows me to use the enum value directly, not as a proxy through another property.
For some crazy reason, enum values are rendered as their string-based names by Razor, rather than their integer value counterparts. Regardless, my guess is that your SelectHelper is returning options with values as integers, which is why converting your enum value to an int allowed the selection to work. Since this is a custom component you have anyways, I would suggest simply modifying your helper to return the enum string names as the option values instead of ints. Then the property value and the option values will line up properly.
I am trying to set a field id as follows:
#Html.EditorFor(x => x.Order, new { id = string.Format("Order_{0}", Model.Row) })
but this results in the following and it seems my id is not being set:
<input type="text" value="334" name="item.Order" id="item_Order" class="text-box single-line">
Does anyone have an idea what I am doing wrong. I checked the allowable formats for EditorFor and looked on google for examples but I could not see anything that matched what I need.
You should change to
#Html.TextBoxFor(x => x.Order, new { id = string.Format("Order_{0}", Model.Row) })
The second parameter of #Html.EditorFor is for view data, not for html attributes
#Html.EditorFor(x => x.Order, null, string.Format("Order_{0}", Model.Row))
I know this question is pretty old, but all I needed to do was the following:
#Html.EditorFor(modelItem => item.EndDate,
new { htmlAttributes = new { #class = "form-control", #id = #endID } })
You can give it whatever classes or id that you want/need. I have this earlier in my page as well to create a different ID for each item:
string endID = "end-" + #item.ID;
Hopefully this helps someone in the future.
have you tried creating an editor template for your x.Order?
have this on your editor template:
<input type="text" id="#ViewData["id"]">
and use this on your view page:
#Html.EditorFor(x => x.Order, new { id = string.Format("Order_{0}", Model.Row) })
I'm not sure if you can override the ID attribute when using the strongly typed helpers. But you can use the other non-model type:
#Html.Editor(string.Format("Order_{0}", Model.Row), Model.Order)
This will use the first parameter as the ID and the second as the default value.
If you want to use EditorFor, you can do this:
#Html.EditorFor(model => model.Order, new { htmlAttributes = new { #id = "YOUR_ID_HERE"})
For the above example it would be:
#Html.EditorFor(model => model.Order, new { htmlAttributes = new { #id = $"Order_{0}" } })
Svetlosav's answer looks good but it will mess up your data binding. If you use that answer, check to see if your model is populating as expected and not with a default value (null, false, 0, etc..).