/// <summary> /// In HTML konvertieren /// </summary> /// <param name="context">Der Kontext, indem das Steuerelement dargestellt wird</param> /// <returns>Das Control als HTML</returns> public override IHtmlNode Render(RenderContextFormular context) { if (Disabled) { Classes.Add("disabled"); } switch (ValidationResult) { case TypesInputValidity.Success: Classes.Add("input-success"); break; case TypesInputValidity.Warning: Classes.Add("input-warning"); break; case TypesInputValidity.Error: Classes.Add("input-error"); break; } var html = new HtmlElementTextContentDiv() { ID = $"moveselector_{ID}", Class = Css.Concatenate("moveselector", GetClasses()), // form-control Style = GetStyles(), Role = "moveselector" }; var selectedHeader = new ControlText("selectedHeader") { Text = context.I18N("webexpress", "form.moveselector.selected"), TextColor = new PropertyColorText(TypeColorText.Muted), Format = TypeFormatText.Paragraph }; var selectedList = new ControlList("selectedOptions") { Layout = TypeLayoutList.Flush }; var leftAllButton = new ControlButton("") { Text = "<<", BackgroundColor = new PropertyColorButton(TypeColorButton.Primary), Block = TypeBlockButton.Block }; var leftButton = new ControlButton("") { Text = "<", BackgroundColor = new PropertyColorButton(TypeColorButton.Primary), Block = TypeBlockButton.Block }; var rightButton = new ControlButton("") { Text = ">", BackgroundColor = new PropertyColorButton(TypeColorButton.Primary), Block = TypeBlockButton.Block }; var rightAllButton = new ControlButton("") { Text = ">>", BackgroundColor = new PropertyColorButton(TypeColorButton.Primary), Block = TypeBlockButton.Block }; var availableHeader = new ControlText("availableHeader") { Text = context.I18N("webexpress", "form.moveselector.available"), TextColor = new PropertyColorText(TypeColorText.Muted), Format = TypeFormatText.Paragraph }; var availableList = new ControlList("availableOptions") { Layout = TypeLayoutList.Flush }; var sticky = new List <string>(new string[] { "position: sticky;" }); html.Elements.Add(new HtmlElementTextContentDiv ( selectedHeader.Render(context), selectedList.Render(context) ) { Class = "moveselector-list" }); html.Elements.Add(new HtmlElementTextContentDiv ( leftAllButton.Render(context), leftButton.Render(context), rightButton.Render(context), rightAllButton.Render(context) ) { Class = "moveselector-button" }); html.Elements.Add(new HtmlElementTextContentDiv ( availableHeader.Render(context), availableList.Render(context) ) { Class = "moveselector-list" }); return(html); }
/// <summary> /// In HTML konvertieren /// </summary> /// <param name="context">Der Kontext, indem das Steuerelement dargestellt wird</param> /// <returns>Das Control als HTML</returns> public override IHtmlNode Render(RenderContextFormular context) { var renderContext = new RenderContextFormularGroup(context, this); var html = new HtmlElementTextContentDiv() { ID = ID, Class = Css.Concatenate("form-group-column", GetClasses()), Style = GetStyles(), }; var max = 100; var offset = 0; foreach (var item in Items) { var input = item as ControlFormularItemInput; var div = new HtmlElementTextContentDiv() { Style = "" }; var width = -1; if (Distribution.Count > offset) { width = Distribution.Skip(offset).Take(1).FirstOrDefault(); div.Style = $"width: { width }%"; max = max - width; offset++; } else if (Items.Count > offset) { width = max / (Items.Count - offset); div.Style = $"width: { width }%"; } if (input != null) { var icon = new ControlIcon() { Icon = input?.Icon }; var label = new ControlFormularItemLabel(!string.IsNullOrEmpty(item.ID) ? item.ID + "_label" : string.Empty); var help = new ControlFormularItemHelpText(!string.IsNullOrEmpty(item.ID) ? item.ID + "_help" : string.Empty); var fieldset = new HtmlElementFormFieldset() { Class = "form-group" }; label.Initialize(renderContext); help.Initialize(renderContext); label.Text = context.I18N(input?.Label); label.FormularItem = item; help.Text = context.I18N(input?.Help); if (icon.Icon != null) { icon.Classes.Add("mr-2 pt-1"); fieldset.Elements.Add(new HtmlElementTextSemanticsSpan(icon.Render(renderContext), label.Render(renderContext)) { Style = "display: flex;" }); } else { fieldset.Elements.Add(label.Render(renderContext)); } fieldset.Elements.Add(item.Render(renderContext)); if (!string.IsNullOrWhiteSpace(input?.Help)) { fieldset.Elements.Add(help.Render(renderContext)); } div.Elements.Add(fieldset); } else { div.Elements.Add(item.Render(context)); } html.Elements.Add(div); } return(html); }
/// <summary> /// In HTML konvertieren /// </summary> /// <param name="context">Der Kontext, indem das Steuerelement dargestellt wird</param> /// <returns>Das Control als HTML</returns> public override IHtmlNode Render(RenderContextFormular context) { var renderContext = new RenderContextFormularGroup(context, this); var html = new HtmlElementTextContentDiv() { ID = ID, Class = Css.Concatenate("", GetClasses()), Style = GetStyles(), }; foreach (var item in Items) { var input = item as ControlFormularItemInput; if (input != null) { var icon = new ControlIcon() { Icon = input?.Icon }; var label = new ControlFormularItemLabel(!string.IsNullOrEmpty(item.ID) ? item.ID + "_label" : string.Empty); var help = new ControlFormularItemHelpText(!string.IsNullOrEmpty(item.ID) ? item.ID + "_help" : string.Empty); var fieldset = new HtmlElementFormFieldset() { Class = "form-group" }; label.Initialize(renderContext); help.Initialize(renderContext); label.Text = context.I18N(input?.Label); label.FormularItem = item; help.Text = context.I18N(input?.Help); if (icon.Icon != null) { icon.Classes.Add("mr-2 pt-1"); fieldset.Elements.Add(new HtmlElementTextSemanticsSpan(icon.Render(renderContext), label.Render(renderContext)) { Style = "display: flex;" }); } else { fieldset.Elements.Add(label.Render(renderContext)); } fieldset.Elements.Add(item.Render(renderContext)); if (!string.IsNullOrWhiteSpace(input?.Help)) { fieldset.Elements.Add(help.Render(renderContext)); } html.Elements.Add(fieldset); } else { html.Elements.Add(item?.Render(context)); } } return(html); }
/// <summary> /// In HTML konvertieren /// </summary> /// <param name="context">Der Kontext, indem das Steuerelement dargestellt wird</param> /// <returns>Das Control als HTML</returns> public override IHtmlNode Render(RenderContextFormular context) { var renderContext = new RenderContextFormularGroup(context, this); var html = new HtmlElementTextContentDiv() { ID = ID, Class = Css.Concatenate("form-group-mix", GetClasses()), Style = GetStyles(), }; var body = new HtmlElementTextContentDiv() { }; foreach (var item in Items) { var input = item as ControlFormularItemInput; var row = new HtmlElementTextContentDiv() { }; if (input != null) { var icon = new ControlIcon() { Icon = input?.Icon }; var label = new ControlFormularItemLabel(!string.IsNullOrEmpty(item.ID) ? item.ID + "_label" : string.Empty); var help = new ControlFormularItemHelpText(!string.IsNullOrEmpty(item.ID) ? item.ID + "_help" : string.Empty); label.Initialize(renderContext); help.Initialize(renderContext); label.Text = context.I18N(input?.Label); label.FormularItem = item; label.Classes.Add("mr-2"); help.Text = context.I18N(input?.Help); if (icon.Icon != null) { icon.Classes.Add("mr-2 pt-1"); row.Elements.Add(new HtmlElementTextContentDiv(icon.Render(renderContext), label.Render(renderContext))); } else { row.Elements.Add(new HtmlElementTextContentDiv(label.Render(renderContext))); } if (!string.IsNullOrWhiteSpace(input?.Help)) { row.Elements.Add(new HtmlElementTextContentDiv(item.Render(renderContext), help.Render(renderContext))); } else { row.Elements.Add(new HtmlElementTextContentDiv(item.Render(renderContext))); } } else { row.Elements.Add(new HtmlElementTextContentDiv()); row.Elements.Add(item.Render(context)); row.Elements.Add(new HtmlElementTextContentDiv()); } body.Elements.Add(row); } html.Elements.Add(body); return(html); }
/// <summary> /// In HTML konvertieren /// </summary> /// <param name="context">Der Kontext, indem das Steuerelement dargestellt wird</param> /// <returns>Das Control als HTML</returns> public override IHtmlNode Render(RenderContextFormular context) { var html = new HtmlElementTextContentDiv ( new HtmlElementFieldLabel ( new HtmlElementFieldInput() { Name = Name, Pattern = Pattern, Type = "checkbox", Disabled = Disabled, //Role = Role, Checked = Value.Equals("true") }, new HtmlText(string.IsNullOrWhiteSpace(Description) ? string.Empty : " " + context.I18N(Description)) ) { } ) { Class = Css.Concatenate("checkbox", GetClasses()), Style = GetStyles(), }; return(html); }