Reputation: 27996
I have a dropdown in asp.net MVC 4 razor view like this:
@{Html.EnableClientValidation(true);}
@using (Html.BeginForm("AddToCart", "Home", FormMethod.Post, new { id = "product-options" }))
{
<select id="items">
<option value="0">Select</option>
@foreach (var option in item.OptionValues)
{
<option @option.ItemOptionValueID>@option.Value</option>
}
</select>
<a href="javascript:$('#product-options').submit();" class="btn btn-orange-2ln">
<span>Continue Shopping</span>
</a>
}
[HttpPost]
public ActionResult AddToCart(int Id, other properties ...)
{
CartItemInfo model = new CartItemInfo();
model.CustomerID =1;
ItemBiz.AddItemToCart(model);
int cartCount = 0;
if (User.Identity.IsAuthenticated)
{
int CustomerId = MembershipBiz.GetCustomerIDByUserID(WebSecurity.CurrentUserId);
cartCount = ItemBiz.GetCartItemsByCustomerID(CustomerId).Count();
}
return view();
}
I want to make it compulsory field so that if "Select" is option, user sees an error message. how to do this ?
Upvotes: 0
Views: 1984
Reputation: 1058
Do not set the value for "Select" option and mark the select
field as required.
<select id="items" required>
<option >Select</option>
Upvotes: 1
Reputation: 714
It seems like you may not be using a model in your razor view? If you did, this task would be much simpler. Your model could look like this:
public class MyModel
{
[Required]
public int? MyValue { get; set; }
public List<SelectListItem> MyOptions
{
get
{
var myOptions = new List<SelectListItem>
{
new SelectListItem
{
Text = "Select",
Value = String.Empty
}
};
foreach (var option in item.OptionValues)
{
myOptions.Add(new SelectListItem
{
Text = option.Value,
Value = option.ItemOptionValueID
});
}
return myOptions;
}
}
}
Then your razor view could look something like:
@using (Html.BeginForm("AddToCart", "Home", FormMethod.Post, new { id = "product-options" }))
{
@Html.DropDownListFor(i => i.MyValue, Model.MyOptions)
@Html.ValidationMessageFor(i => i.MyValue)
<a href="javascript:$('#product-options').submit();" class="btn btn-orange-2ln">
<span>Continue Shopping</span>
</a>
}
And finally your post action could look something like:
[HttpPost]
public ActionResult AddToCart(MyModel model)
{
if (!ModelState.IsValid) return View('TheInitialViewName', model);
CartItemInfo model = new CartItemInfo();
model.CustomerID =1;
ItemBiz.AddItemToCart(model);
int cartCount = 0;
if (User.Identity.IsAuthenticated)
{
int CustomerId = MembershipBiz.GetCustomerIDByUserID(WebSecurity.CurrentUserId);
cartCount = ItemBiz.GetCartItemsByCustomerID(CustomerId).Count();
}
return view();
}
Something like that would handle both client and server-side validation.
Upvotes: 0