MVC5 Validate- To date greater than from date - validation

Question

I am having two datepickers fields on my form, and i would like to validate that the to date is greater than from date.
Is there any validation attribute in MVC5 which I can use to achieve this?
I would also like this to work on client side, can some body please help in enabling client side validation in MVC?
Many Thanks
Edit: Created the custom attribute, but client side validation not working.
public class ValidateToDateAttribute : ValidationAttribute, IClientValidatable
{
public string errorMessageKey { get; private set; }
public ValidateToDateAttribute(string errorMessageKey)
{
this.errorMessageKey = errorMessageKey;
}
protected override ValidationResult IsValid(object value, ValidationContext validationContext)
{
if (value != null)
{
var viewModel = (TransactionViewModel)validationContext.ObjectInstance;
if (viewModel.ToDate.CompareTo(viewModel.FromDate) < 0)
{
return new ValidationResult(new ResourceManager(typeof(ValidationErrorMessages)).GetString(errorMessageKey));
}
}
return ValidationResult.Success;
}
public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
{
var modelClientValidationRule = new ModelClientValidationRule
{
ValidationType = "validatetodate",
ErrorMessage = new ResourceManager(typeof(ValidationErrorMessages)).GetString(errorMessageKey)
};
yield return modelClientValidationRule;
}
}
}
Bundle.Config
bundles.Add(new ScriptBundle("~/bundles/jqueryvalidation").Include(
"~/Scripts/jquery.validate.unobtrusive.min.js",
"~/Scripts/jquery.unobtrusive-ajax.min.js"));
View Model
[Display(ResourceType = typeof(DisplayLabelText), Name = "FromDate")]
public DateTime FromDate { get; set; }
[Display(ResourceType = typeof(DisplayLabelText), Name = "ToDate")]
[ValidateToDate("ToDateMustBeGreater")]
public DateTime ToDate { get; set; }
in View:
<div class="col-sm-7 margin-top-10">
<div class="col-sm-12">
#Html.LabelFor(m => m.FromDate, new { #class = "col-sm-3 form-group control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.FromDate, "{0:MMM dd yyyy}", new { #class = "datepicker", disabled = "disabled" })
</div>
</div>
<div class="col-sm-12">
#Html.LabelFor(m => m.ToDate, new { #class = "col-sm-3 form-group control-label" })
<div class="col-sm-8">
#Html.TextBoxFor(m => m.ToDate, "{0:MMM dd yyyy}", new { #class = "datepicker", disabled = "disabled" })
#Html.ValidationMessageFor(m => m.ToDate)
</div>
</div>
<button type="submit" class="apply-filter-button">Apply Filter</button>
</div>

Answer 1

I figured it out, I was missing the unobtrusive java script code:
please see the below, it might be helpful for some one.
public class ValidateToDateAttribute : ValidationAttribute, IClientValidatable
{
/// <summary>
/// Initializes a new instance of the <see cref="ValidateToDateAttribute"/> class.
/// </summary>
/// <param name="errorMessageKey">The error message key.</param>
public ValidateToDateAttribute(string errorMessageKey, string otherProperty)
{
this.ErrorMessageKey = errorMessageKey;
this.FromDate = otherProperty;
}
/// <summary>
/// Gets from date.
/// </summary>
/// <value>
/// From date.
/// </value>
public string FromDate { get; private set; }
/// <summary>
/// Gets the error message key.
/// </summary>
/// <value>
/// The error message key.
/// </value>
public string ErrorMessageKey { get; private set; }
/// <summary>
/// When implemented in a class, returns client validation rules for that class.
/// </summary>
/// <param name="metadata">The model metadata.</param>
/// <param name="context">The controller context.</param>
/// <returns>
/// The client validation rules for this validator.
/// </returns>
public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
{
var modelClientValidationRule = new ModelClientValidationRule
{
ValidationType = "validatetodate",
ErrorMessage = new ResourceManager(typeof(ValidationErrorMessages)).GetString(this.ErrorMessageKey),
};
modelClientValidationRule.ValidationParameters.Add("other", this.FromDate);
yield return modelClientValidationRule;
}
/// <summary>
/// Validates the specified value with respect to the current validation attribute.
/// </summary>
/// <param name="value">The value to validate.</param>
/// <param name="validationContext">The context information about the validation operation.</param>
/// <returns>
/// An instance of the <see cref="T:System.ComponentModel.DataAnnotations.ValidationResult" /> class.
/// </returns>
protected override ValidationResult IsValid(object value, ValidationContext validationContext)
{
if (value != null)
{
var viewModel = (TransactionViewModel)validationContext.ObjectInstance;
if (viewModel.ToDate.CompareTo(viewModel.FromDate) < 0)
{
return new ValidationResult(new ResourceManager(typeof(ValidationErrorMessages)).GetString(this.ErrorMessageKey));
}
}
return ValidationResult.Success;
}
}
JavaScript:
<script type="text/javascript">
jQuery.validator.addMethod('greaterThan', function (value, element, params) {
if (!/Invalid|NaN/.test(new Date(value))) {
//return new Date(value) > new Date($("input[name='FromDate']").val());
return Date.parse(value) > Date.parse($(params).val());
}
return isNaN(value) && isNaN($(fromDate)) || (parseFloat(value) > parseFloat($("input[name='FromDate']").val()));
}, '');
// and an unobtrusive adapter
jQuery.validator.unobtrusive.adapters.add('validatetodate', ["other"], function (options) {
options.rules['greaterThan'] = "#" + options.params.other;
options.messages['greaterThan'] = options.message;
});