Search code examples
asp.net-mvcunobtrusive-validation

Validation does not apply to dropdowns in mvc5


Note the following code. My problem is that since upgrading mvc4 to mvc5, dropdown validation is not done correctly. In the code below, although I've set in the model dropdown is mandatory, but if the user does not select it, it will not give any errors to the user and will save the amount in the database zero.

dropdowns have been styled with chosen-jquery

My Model:

[Required(ErrorMessage = "*")]
public int PaymentTypeID { get; set; }

My Code:

<html>
<head>
    <script src="/Scripts/jquery-3.3.1.min.js" type="text/javascript"></script>
</head>

<body>

<div class="row">
        <div class="col-md-1">
            @Html.LabelFor(model => model.PaymentTypeID, new { @class = "control-lable" })
        </div>
        <div class="col-md-3">
            @Html.DropDownListFor(model => model.PaymentTypeID, (SelectList)(ViewData["PaymentTypelist"]), "Choose..", new { @class = "form-control chosen-select" })
        </div>
        <div class="col-md-2">
            @Html.ValidationMessageFor(model => model.PaymentTypeID)
        </div>
</div>

    <script src="/Scripts/Menu/html5shiv.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-ui-1.12.1.min.js" type="text/javascript"></script>
    <script src="/Scripts/Menu/actions.js" type="text/javascript"></script>
    <script src="/Scripts/Menu/jquery.cookies.2.2.0.min.js" type="text/javascript"></script>


    <script src="/Scripts/bootstrap.min.js" type="text/javascript"></script>


    <script src="/Scripts/fontawesome-all.js"></script>


    <script src="/Scripts/modernizr-2.0.6-development-only.js" type="text/javascript"></script>

    <script src="/Scripts/enquire.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>

    <script src="/Scripts/jquery.pnotify.min.js" type="text/javascript"></script>


    <script src="/Scripts/placeholdr.js" type="text/javascript"></script>
    <script src="/Scripts/respond.min.js" type="text/javascript"></script>
    <script src="/Scripts/chosen.jquery.js" type="text/javascript"></script>

    <script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>


    <script src="/Scripts/knockout-3.4.2.js" type="text/javascript"></script>

    <script src="/Scripts/attachfiles.js"></script>


    <script src="/Scripts/jquery-ui-datetimepicker.min.js" type="text/javascript"></script>


</body>
</html>

Solution

  • The RequiredAttribute attribute specifies that when a field on a form is validated, the field must contain a value. A validation exception is raised if the property is null, contains an empty string (""), or contains only white-space characters.

    So [Required] only works for nullable type. Try using Nullable<int> or int? instead of int.

    [Required(ErrorMessage = "*")]
    public int? PaymentTypeID { get; set; }