diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Form-elements.md b/docs/en/UI/AspNetCore/Tag-Helpers/Form-elements.md index 0275bf8030..9140858c11 100644 --- a/docs/en/UI/AspNetCore/Tag-Helpers/Form-elements.md +++ b/docs/en/UI/AspNetCore/Tag-Helpers/Form-elements.md @@ -271,6 +271,7 @@ Usage: ````xml + ```` Model: @@ -280,9 +281,13 @@ Model: { public SampleModel MyModel { get; set; } + public DynamicForm DynamicFormExample { get; set; } + public void OnGet() { MyModel = new SampleModel(); + + DynamicFormExample = new DynamicForm(); } public class SampleModel @@ -293,6 +298,27 @@ Model: public DateTime MyDateRangeEnd { get; set; } } + + public class DynamicForm + { + [DateRangePicker("MyPicker",true)] + public DateTime StartDate { get; set; } + + [DateRangePicker("MyPicker",false)] + [DatePickerOptions(nameof(DatePickerOptions))] + public DateTime EndDate { get; set; } + + public DateTime DateTime { get; set; } + + public DynamicForm() + { + StartDate = DateTime.Now; + EndDate = DateTime.Now; + DateTime = DateTime.Now; + } + } + + public AbpDatePickerOptions DatePickerOptions { get; set; } } ```` @@ -311,7 +337,7 @@ You can set some of the attributes on your c# property, or directly on HTML tag. - `AbpFormControlSize.Large` * `[DisabledInput]` : Sets the input as disabled. * `[ReadOnlyInput]`: Sets the input as read-only. -- `[DatePickerOptions()]`: Sets the predefined options of the date picker. See the available [datepicker options](https://www.daterangepicker.com/#options). You can use a localization key directly. +- `[DatePickerOptions()]`: Sets the predefined options of the date picker. Parameter should be the name of the options property (see example above). See the available [datepicker options](https://www.daterangepicker.com/#options). You can use a localization key directly. ##### abp-date-picker `[DatePicker]` : Sets the input as datepicker. Especially for string properties. diff --git a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerBaseTagHelperService.cs b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerBaseTagHelperService.cs index b9244ff326..dbcd4e23ac 100644 --- a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerBaseTagHelperService.cs +++ b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerBaseTagHelperService.cs @@ -217,6 +217,12 @@ public abstract class AbpDatePickerBaseTagHelperService : AbpTagHelp protected TagHelperAttributeList ConvertDatePickerOptionsToAttributeList(IAbpDatePickerOptions options) { var attrList = new TagHelperAttributeList(); + + if(options == null) + { + return attrList; + } + if (options.Locale != null) { attrList.Add("data-locale", JsonSerializer.Serialize(options.Locale)); @@ -420,10 +426,10 @@ public abstract class AbpDatePickerBaseTagHelperService : AbpTagHelp attrList.Add(attr); } - var optionsAttribute = GetAttribute(); - if(optionsAttribute != null) + var optionsAttribute = GetAttributeAndModelExpression(out var modelExpression); + if (optionsAttribute != null) { - foreach (var attr in ConvertDatePickerOptionsToAttributeList(optionsAttribute)) + foreach (var attr in ConvertDatePickerOptionsToAttributeList(optionsAttribute.GetDatePickerOptions(modelExpression.ModelExplorer))) { attrList.Add(attr); } diff --git a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerRange.cs b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerRange.cs index 727110c56c..eea3d2ad31 100644 --- a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerRange.cs +++ b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/AbpDatePickerRange.cs @@ -8,6 +8,49 @@ public class AbpDatePickerRange private readonly List _dates = new List(); public string Label { get; set; } public IReadOnlyList Dates => _dates; + + public AbpDatePickerRange() + { + + } + public AbpDatePickerRange(string label, DateTime start, DateTime end) + { + Label = label; + AddDate(start); + AddDate(end); + } + + public AbpDatePickerRange(string label, DateTime date) + { + Label = label; + AddDate(date); + } + + public AbpDatePickerRange(string label, DateTimeOffset start, DateTimeOffset end) + { + Label = label; + AddDate(start); + AddDate(end); + } + + public AbpDatePickerRange(string label, DateTimeOffset date) + { + Label = label; + AddDate(date); + } + + public AbpDatePickerRange(string label, string start, string end) + { + Label = label; + AddDate(start); + AddDate(end); + } + + public AbpDatePickerRange(string label, string date) + { + Label = label; + AddDate(date); + } public void AddDate(string date) { diff --git a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/DatePickerOptionsAttribute.cs b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/DatePickerOptionsAttribute.cs index 8b64b28d05..9cff72aa23 100644 --- a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/DatePickerOptionsAttribute.cs +++ b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/DatePicker/DatePickerOptionsAttribute.cs @@ -1,180 +1,34 @@ using System; -using System.Collections.Generic; +using System.Linq; +using Microsoft.AspNetCore.Mvc.ViewFeatures; namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Form.DatePicker; [AttributeUsage(AttributeTargets.Property)] -public class DatePickerOptionsAttribute : Attribute, IAbpDatePickerOptions +public class DatePickerOptionsAttribute : Attribute { - private readonly IAbpDatePickerOptions _abpDatePickerOptionsImplementation; - - public DatePickerOptionsAttribute() + public string DatePickerOptionsPropertyName { get; set; } + + public DatePickerOptionsAttribute(string datePickerOptionsPropertyName) { - _abpDatePickerOptionsImplementation = new AbpDatePickerOptions(); - } - - public string PickerId { - get => _abpDatePickerOptionsImplementation.PickerId; - set => _abpDatePickerOptionsImplementation.PickerId = value; - } - - public DateTime? MinDate { - get => _abpDatePickerOptionsImplementation.MinDate; - set => _abpDatePickerOptionsImplementation.MinDate = value; - } - - public DateTime? MaxDate { - get => _abpDatePickerOptionsImplementation.MaxDate; - set => _abpDatePickerOptionsImplementation.MaxDate = value; - } - - public object MaxSpan { - get => _abpDatePickerOptionsImplementation.MaxSpan; - set => _abpDatePickerOptionsImplementation.MaxSpan = value; - } - - public bool? ShowDropdowns { - get => _abpDatePickerOptionsImplementation.ShowDropdowns; - set => _abpDatePickerOptionsImplementation.ShowDropdowns = value; - } - - public int? MinYear { - get => _abpDatePickerOptionsImplementation.MinYear; - set => _abpDatePickerOptionsImplementation.MinYear = value; - } - - public int? MaxYear { - get => _abpDatePickerOptionsImplementation.MaxYear; - set => _abpDatePickerOptionsImplementation.MaxYear = value; - } - - public AbpDatePickerWeekNumbers WeekNumbers { - get => _abpDatePickerOptionsImplementation.WeekNumbers; - set => _abpDatePickerOptionsImplementation.WeekNumbers = value; + DatePickerOptionsPropertyName = datePickerOptionsPropertyName; } - - public bool? TimePicker { - get => _abpDatePickerOptionsImplementation.TimePicker; - set => _abpDatePickerOptionsImplementation.TimePicker = value; - } - - public int? TimePickerIncrement { - get => _abpDatePickerOptionsImplementation.TimePickerIncrement; - set => _abpDatePickerOptionsImplementation.TimePickerIncrement = value; - } - - public bool? TimePicker24Hour { - get => _abpDatePickerOptionsImplementation.TimePicker24Hour; - set => _abpDatePickerOptionsImplementation.TimePicker24Hour = value; - } - - public bool? TimePickerSeconds { - get => _abpDatePickerOptionsImplementation.TimePickerSeconds; - set => _abpDatePickerOptionsImplementation.TimePickerSeconds = value; - } - - public List Ranges { - get => _abpDatePickerOptionsImplementation.Ranges; - set => _abpDatePickerOptionsImplementation.Ranges = value; - } - - public bool? ShowCustomRangeLabel { - get => _abpDatePickerOptionsImplementation.ShowCustomRangeLabel; - set => _abpDatePickerOptionsImplementation.ShowCustomRangeLabel = value; - } - - public bool? AlwaysShowCalendars { - get => _abpDatePickerOptionsImplementation.AlwaysShowCalendars; - set => _abpDatePickerOptionsImplementation.AlwaysShowCalendars = value; - } - - public AbpDatePickerOpens Opens { - get => _abpDatePickerOptionsImplementation.Opens; - set => _abpDatePickerOptionsImplementation.Opens = value; - } - - public AbpDatePickerDrops Drops { - get => _abpDatePickerOptionsImplementation.Drops; - set => _abpDatePickerOptionsImplementation.Drops = value; - } - - public string ButtonClasses { - get => _abpDatePickerOptionsImplementation.ButtonClasses; - set => _abpDatePickerOptionsImplementation.ButtonClasses = value; - } - - public string TodayButtonClasses { - get => _abpDatePickerOptionsImplementation.TodayButtonClasses; - set => _abpDatePickerOptionsImplementation.TodayButtonClasses = value; - } - - public string ApplyButtonClasses { - get => _abpDatePickerOptionsImplementation.ApplyButtonClasses; - set => _abpDatePickerOptionsImplementation.ApplyButtonClasses = value; - } - - public string ClearButtonClasses { - get => _abpDatePickerOptionsImplementation.ClearButtonClasses; - set => _abpDatePickerOptionsImplementation.ClearButtonClasses = value; - } - - public object Locale { - get => _abpDatePickerOptionsImplementation.Locale; - set => _abpDatePickerOptionsImplementation.Locale = value; - } - - public bool? AutoApply { - get => _abpDatePickerOptionsImplementation.AutoApply; - set => _abpDatePickerOptionsImplementation.AutoApply = value; - } - - public bool? LinkedCalendars { - get => _abpDatePickerOptionsImplementation.LinkedCalendars; - set => _abpDatePickerOptionsImplementation.LinkedCalendars = value; - } - - public bool? AutoUpdateInput { - get => _abpDatePickerOptionsImplementation.AutoUpdateInput; - set => _abpDatePickerOptionsImplementation.AutoUpdateInput = value; - } - - public string ParentEl { - get => _abpDatePickerOptionsImplementation.ParentEl; - set => _abpDatePickerOptionsImplementation.ParentEl = value; - } - - public string DateFormat { - get => _abpDatePickerOptionsImplementation.DateFormat; - set => _abpDatePickerOptionsImplementation.DateFormat = value; - } - - public bool OpenButton { - get => _abpDatePickerOptionsImplementation.OpenButton; - set => _abpDatePickerOptionsImplementation.OpenButton = value; - } - - public bool ClearButton { - get => _abpDatePickerOptionsImplementation.ClearButton; - set => _abpDatePickerOptionsImplementation.ClearButton = value; - } - - public bool SingleOpenAndClearButton { - get => _abpDatePickerOptionsImplementation.SingleOpenAndClearButton; - set => _abpDatePickerOptionsImplementation.SingleOpenAndClearButton = value; - } - - public bool? IsUtc { - get => _abpDatePickerOptionsImplementation.IsUtc; - set => _abpDatePickerOptionsImplementation.IsUtc = value; - } - - public bool? IsIso { - get => _abpDatePickerOptionsImplementation.IsIso; - set => _abpDatePickerOptionsImplementation.IsIso = value; - } - - public object Options { - get => _abpDatePickerOptionsImplementation.Options; - set => _abpDatePickerOptionsImplementation.Options = value; + + public IAbpDatePickerOptions GetDatePickerOptions(ModelExplorer explorer) + { + var properties = explorer.Container.Properties.Where(p => p.Metadata.PropertyName != null && p.Metadata.PropertyName.Equals(DatePickerOptionsPropertyName)).ToList(); + + while (properties.Count == 0) + { + explorer = explorer.Container; + if(explorer.Container == null) + { + return null; + } + + properties = explorer.Container.Properties.Where(p => p.Metadata.PropertyName != null && p.Metadata.PropertyName.Equals(DatePickerOptionsPropertyName)).ToList(); + } + + return properties.FirstOrDefault(p=> p.Model is IAbpDatePickerOptions)?.Model as IAbpDatePickerOptions; } } \ No newline at end of file diff --git a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/wwwroot/libs/abp/aspnetcore-mvc-ui-theme-shared/bootstrap/dom-event-handlers.js b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/wwwroot/libs/abp/aspnetcore-mvc-ui-theme-shared/bootstrap/dom-event-handlers.js index bbc26e4e1f..c02467e01e 100644 --- a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/wwwroot/libs/abp/aspnetcore-mvc-ui-theme-shared/bootstrap/dom-event-handlers.js +++ b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/wwwroot/libs/abp/aspnetcore-mvc-ui-theme-shared/bootstrap/dom-event-handlers.js @@ -290,6 +290,7 @@ $container.data('options', options); abp.dom.initializers.initializeDateRangePickers($container); + $container[0].datePicker = $datePicker[0]; return $container; } }; @@ -355,7 +356,7 @@ } else { end = value[0]; } - options.ranges[key] = [getMoment(start, options), getMoment(end, options.isUtc)]; + options.ranges[key] = [getMoment(start, options), getMoment(end, options)]; }); } @@ -448,7 +449,7 @@ var today = getMoment(undefined, options); $input.data('daterangepicker').setStartDate(today); $input.data('daterangepicker').setEndDate(today); - $input.data('daterangepicker').updateView(); + $input.data('daterangepicker').clickApply(); }); return $todayBtn;