Javascript 如何使用相同的模型在相同的MVC页面上重用表单？_Javascript_Jquery_Asp.net Mvc_Forms

Javascript 如何使用相同的模型在相同的MVC页面上重用表单？

javascript jquery asp.net-mvc forms

Javascript 如何使用相同的模型在相同的MVC页面上重用表单？,javascript,jquery,asp.net-mvc,forms,Javascript,Jquery,Asp.net Mvc,Forms,我有一个建立了一个简单的姓名，电子邮件和电话联系形式的看法。我在同一个父页面上重复使用此表单两到三次。当用户提交其中一个表单时，我会检测提交的表单，并使用javascript/jQuery将内容发布到数据库问题是，当我在任何页面上重复使用联系人表单时，输入字段将不会生成唯一ID。这会导致w3验证失败，说明重复ID。在这种特殊情况下，我需要页面通过w3验证我该如何着手解决这个问题？我尝试使用ViewData.TemplateInfo.HtmlFieldPrefix为输入字段添加前缀，但由于前缀

我有一个建立了一个简单的姓名，电子邮件和电话联系形式的看法。我在同一个父页面上重复使用此表单两到三次。当用户提交其中一个表单时，我会检测提交的表单，并使用javascript/jQuery将内容发布到数据库

问题是，当我在任何页面上重复使用联系人表单时，输入字段将不会生成唯一ID。这会导致w3验证失败，说明重复ID。在这种特殊情况下，我需要页面通过w3验证

我该如何着手解决这个问题？我尝试使用

ViewData.TemplateInfo.HtmlFieldPrefix

为输入字段添加前缀，但由于前缀值是静态的，因此并没有真正解决问题。若我做了一个随机前缀值，那个么如何在HttpPost控制器中捕获它呢

这是我的密码

Index.cshtml -多次引用

ContactForm.cshtml

：

<html>
<head>...</head>
<body>
....
 @{Html.RenderAction("ContactForm")}
....
 @{Html.RenderAction("ContactForm")}
....
</body>
</html>

HomeController

// GET
[ChildActionOnly]
[Route("~/Home/ContactForm")]
public ActionResult ContactForm()
{
    // tried this but this is a static value. 
    // ViewData.TemplateInfo.HtmlFieldPrefix = "SomePrefix";

    return PartialView(new CaseModel());
}

// POST
[HttpPost]
[Route("~/Home/SendMessage")]
public async Task<PartialViewResult> SendMessage(CaseModel model)
{
   ... brevity...
   await SaveData(model);
}

//获取
[仅限儿童]
[路线（“~/Home/ContactForm”）]
公共行动结果联系人表单（）
{
//已尝试此操作，但这是一个静态值。
//ViewData.TemplateInfo.HtmlFieldPrefix=“SomePrefix”；
返回PartialView（新CaseModel（））；
}
//职位
[HttpPost]
[路由（“~/Home/SendMessage”）]
公共异步任务SendMessage（案例模型）
{
…简洁。。。
等待保存数据（模型）；
}

例如，您可以通过在

htmlAttributes

参数中将

id

属性设置为空字符串来删除该属性

@Html.TextInputFor(model => model.Name, Res.Name, new { id = "", placeholder = Res.Name } )

尽管您可能想考虑在<代码> TXTIN（）/<代码>扩展方法.< /P>中执行此操作。作为旁注，您的扩展方法不考虑属性的显示名称（当使用

[display（name=“…”）]

属性时，

title

参数是不必要的。我建议您的代码应该是

public static MvcHtmlString TextInputFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes = null)
{
    ModelMetadata metaData = ModelMetadata.FromLambdaExpression(expression, helper.ViewData);
    string displayName = metaData.DisplayName;
    if (metaData.IsRequired)
    {
        displayName += " *";
    }
    StringBuilder html = new StringBuilder();
    html.Append(helper.LabelFor(expression, displayName).ToString());
    html.Append(helper.TextBoxFor(expression, htmlAttributes).ToString());
    html.Append(helper.ValidationMessageFor(expression).ToString());
    TagBuilder container = new TagBuilder("div");
    container.AddCssClass("inp");
    container.InnerHtml = html.ToString();
    return new MvcHtmlString(container.ToString());
}

public static MvcHtmlString TextInputFor（此HtmlHelper助手，表达式，对象htmlAttributes=null）
{
ModelMetadata=ModelMetadata.FromLambdaExpression（表达式，helper.ViewData）；
字符串displayName=metaData.displayName；
if（metaData.IsRequired）
{
显示名称+=“*”；
}
StringBuilder html=新的StringBuilder（）；
Append（helper.LabelFor（expression，displayName.ToString（））；
Append（helper.TextBoxFor（expression，htmlAttributes.ToString（））；
Append（helper.ValidationMessageFor（expression.ToString（））；
标记生成器容器=新标记生成器（“div”）；
容器。添加CSSClass（“inp”）；
container.InnerHtml=html.ToString（）；
返回新的MvcHtmlString（container.ToString（））；
}

为什么需要前缀？是否要在同一页中多次插入表单？始终可以删除

id

attributes-

new{id=”“，placeholder=Res.Name}

@Shyju-也许我不需要前缀，但如果相同的ID在页面上出现两次，w3验证将失败，在这种情况下不能。此外，我执行一些jquery客户端验证-例如，字段是否为空等。@StephenMuecke-不会删除

ID

这会导致客户端验证失败？

ID

属性没有任何可更改的内容o对于客户端验证，非常感谢！：）出于好奇，如果一个人真的需要

id

是唯一的-这是如何实现的？拥有

id

属性的唯一原因是用于css或javascript/jQuery选择器，因此在您的情况下可能不需要它们，但是有一些选项，例如，创建

Guid

并将其附加到助手生成的

id

（但这会使它们在css或javascript选择器方面毫无用处）作为旁注，您的扩展方法中还有一个关于标签的缺陷-它不会使用任何

[Display（Name=“…”）的值

可以应用于属性的属性。方法中的第二个参数似乎毫无意义。当我有机会的时候，我会用扩展方法的外观来更新答案，包括如何删除helper中的

id

属性。我进一步开发的想法是，我会在jQuery中引用其中的一些属性，或者只是在vanilla js中。执行

Guid

听起来是个不错的主意，但是您不需要像这样告诉HttpPost控制器这个动态

Guid

吗

[Bind（Prefix=Guid here？）]CaseModel模型

？我做这样的属性：

[Required（ErrorMessageResourceType=typeof（Res），ErrorMessageResourceName=“ValidationRequired”）]公共字符串名称{get；set；}

-这似乎适用于扩展名。

@Html.TextInputFor(model => model.Name, Res.Name, new { id = "", placeholder = Res.Name } )

public static MvcHtmlString TextInputFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes = null)
{
    ModelMetadata metaData = ModelMetadata.FromLambdaExpression(expression, helper.ViewData);
    string displayName = metaData.DisplayName;
    if (metaData.IsRequired)
    {
        displayName += " *";
    }
    StringBuilder html = new StringBuilder();
    html.Append(helper.LabelFor(expression, displayName).ToString());
    html.Append(helper.TextBoxFor(expression, htmlAttributes).ToString());
    html.Append(helper.ValidationMessageFor(expression).ToString());
    TagBuilder container = new TagBuilder("div");
    container.AddCssClass("inp");
    container.InnerHtml = html.ToString();
    return new MvcHtmlString(container.ToString());
}