如何基于 mvc 中的模型动态创建动态表单？ [关闭]

Question

我们有一些客户希望以不同的方式使用网页。如果我应该更清楚一点，假设我们有一个 Person 模型，并且这个模型显然具有一些属性，例如 Name、Number、Address 等。

客户 X 希望属性 Name 为 必需，Number 为 invisible 和 Address 作为只读

客户 Y 希望属性 Name 作为必需，Number 作为必需 和 Address 作为不可见。

其他客户对这些页面的需求不同。

我不想为每个客户创建一个页面。如我所见，我可能需要动态网页构建器之类的东西，它可以让我们的客户根据模型构建自定义页面。

你认为我可以如何处理这个问题？ MVC 或 jQuery 中是否有开源解决方案？还有其他推荐吗？

Answer 1

这是我们的解决方案：

我们创建了一个模型类来将设置存储在数据库中，命名为 CustomModelEditor。我们还创建了一个公共类，用于在 Razor 视图端创建我们自己的 @Html 方法，并将其命名为 CustomWebForm。

在 CustomWebForm 类中，我们创建了一个返回 MvcHtmlString 值的方法，并使用 InputExtensions 覆盖了 html 输入。请参阅下面的代码。

    public static MvcHtmlString MyTextBox(this HtmlHelper html, CustomModelEditor property, object additionalViewData = null)
        {

            dynamic htmlattr = additionalViewData ?? new ExpandoObject();

            htmlattr.@class = "form-control";
            htmlattr.type = property.InputType.ToString().ToLower();

            if (property.IsRequired)
                htmlattr.required = "required";
            if (property.IsReadonly)
                htmlattr.@readonly = "readonly";
            if (property.IsDisabled)
                htmlattr.disabled = "disabled";
            if (property.Length != 0)
                htmlattr.maxlength = property.Length;
            if (property.Value == null)
                property.Value = property.DefaultValue;

            htmlattr.value = property.Value;

            return InputExtensions.TextBox(html, property.Name, property.Value, htmlattr);
        }

我有这个用于标签、复选框和其他 html 元素。

在控制器上，我们创建了一个ExpandoObject，以便从数据库传递输入设置。

    public ActionResult Test()
    {

        dynamic contact = new ExpandoObject();

        // this part is static for now, will be get input settings from database
        contact.Name = new CustomModelEditor();
        contact.Name.Value = null;
        contact.Name.Name = nameof(contact.Name);
        contact.Name.DefaultValue = "Not Set";
        contact.Name.IsRequired = true;

        contact.Email = new CustomModelEditor();
        contact.Email.Name = nameof(contact.Email);
        contact.Email.Value = "";
        contact.Email.InputType = DataModels.InputType.Email;
        contact.Email.DefaultValue = "";
        contact.Email.IsRequired = true;

        return View(contact);
    }

在 view.cshtml 的 Razor 端，我只是调用了 MyTextBox 方法。

@using MyWebProject.DataModels
@using System.Dynamic

@model dynamic

@{
    ViewBag.Title = "Test";
}

<form>

    @Html.MyTextBox((CustomModelEditor)Model.Name)
    @Html.MyTextBox((CustomModelEditor)Model.Email)
    <button type="submit">test</button>
</form>

Answer 2

您可以为每个客户创建一个 CustomerValidation 实体，并将每个客户的所有验证存储在数据库中。 在您的 API 中，您可以创建一个服务来检查验证并根据客户模板在任何验证失败时返回带有错误的模型。

public class CustomerValidation
{
   public string propertyName {get;set;}
   public string validationRegex {get;set;}
   public string ValidationMessage {get;set;}
   public int ID {get;set;}
   public int CustomerId {get;set;}
   public virtual Customer CustomerInfo {get;set;}
}

CustomerValidation 的示例条目可以是

Name, ^[a-zA-Z ]*$ ,Name should start with letter