ASP.Net MVC 3 - 为编辑模板客户端不显眼的审定 [英] ASP.Net MVC 3 - Client side unobtrusive validation for Editor Templates

问题描述

我是新来的ASP.Net MVC 3，遇到了一些问题，而试图实现客户端不显眼验证了我为显示自定义的方式日期创建编辑模板。

I am new to ASP.Net MVC 3, facing some issues while trying to implementing client side unobtrusive validation for a editor template I have created for showing date in a custom way.

UI 结果
我需要显示在三texbox UI 的格式日期

我提出了一个的 EditorTemplate 的显示三部分的日期

@model DateTime?

<table class="datetime">
<tr>
    <td>@Html.TextBox("Day", (Model.HasValue ? Model.Value.ToString("dd") : string.Empty)) </td>
    <td class="separator">/</td>
    <td>@Html.TextBox("Month", (Model.HasValue ? Model.Value.ToString("MM") : string.Empty))</td>
    <td class="separator">/</td>
    <td>@Html.TextBox("Year", (Model.HasValue ? Model.Value.ToString("yyyy") : string.Empty))</td>
</tr>
<tr>
    <td class="label">dd</td>
    <td/>
    <td class="label">mm</td>
    <td/>
    <td class="label">yyyy</td>
</tr>
</table>

型号


我出生场的日期是在的子对象的我的模型，这两个属性，绑定在这个结构中

Model
I have to bind a Date of Birth field which is a property in a subobject of my model to this property, in this structure

MyModel
    --> MySubModel
          --> DateOfBirth

public class MySubModel
{
    ...

    [DataType(DataType.Date)]
    [Display(Name = "Date of birth")]
    [DateTimeClientValidation()]
    public DateTime DateofBirth { get; set; }

    ...
}

客户方验证

Clientside Validation

我都忍了，它实现IClientValidatable为

I have put up a custom validation attribute which implements IClientValidatable as

public class DateTimeClientValidationAttribute : ValidationAttribute, IClientValidatable
{
    ...

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        List<ModelClientValidationRule> clientRules = new List<ModelClientValidationRule>();

        //Combined date should be valid
        ModelClientValidationRule validDateRule = new ModelClientValidationRule
        {
            ErrorMessage = "Please enter a valid date.",
            ValidationType = "validdate"
        };
        validDateRule.ValidationParameters.Add("dayelement", metadata.PropertyName + ".Day");
        validDateRule.ValidationParameters.Add("monthelement", metadata.PropertyName + ".Month");
        validDateRule.ValidationParameters.Add("yearelement", metadata.PropertyName + ".Year");
        clientRules.Add(validDateRule);

        return clientRules;
    }
    ...
}

我想发出日，月和放大器的元素​​名称;新年文本框在这里客户端验证的元素，让我稍后会写一个客户端jQuery验证方法和适配器，它会消耗这些元素，并在客户端做验证。

I am trying to emit the element names of Day, Month & Year textboxes here to client side validation elements, so that I will write a client side jquery validation method and adapter later which would consume those elements and do the validation at the client side.

查看


现在，使用这个编辑器模板，我把的查看的以下行

@model MyModel
...
<tr>
    <td class="editor-label">
        @Html.LabelFor(m => m.MySubModel.DateofBirth)
    </td>
    <td class="editor-field">
        @Html.EditorFor(m => m.MySubModel.DateofBirth)
        @Html.ValidationMessageFor(m => m.MySubModel.DateofBirth)
    </td>
</tr>
...

的添加了所有相关的jQuery验证文件的视图引用的

问题

Questions

1. 这不是发射了HTML中的非侵入式JavaScript验证属性，虽然我已实施的 IClientValidatable 的。
   出于测试目的，当我把在其中没有使用这个编辑器模板的模型的另一个属性相同的属性（ DateTimeClientValidation 的），那么它发射出的属性验证，但是它没有针对这只是发射出来编辑模板。凡可能我哪里呢？


2. 关于验证消息跨度编辑模板，是不是正确的，我把它放在只查看或我应该把它直接在编辑器中模板（ @ Html.ValidationMessageFor（M => m.MySubModel.DateofBirth） 的）


3. 在这个例子中，我是正确的设计，我已经把的 DateTimeClientValidationAttribute 的，这其实是我把模型的属性，但这种组件知道一些关于UI（因为它试图发出了日，月和放大器;年元素命名到客户端），这使得型号大概了解了一下景，我在违反任何设计原则在这里


4. 在 DateTimeClientValidationAttribute 的，我想发出了日，月和放大器;年元素名称给客户端，使客户端脚本可以在其上做验证。但由于模型属性的出生日期的是一个子对象，在脚本实际的元素名称的 MySubObject.DateOfBirth 的，这使得日文本框的名称为 MySubObject。 DateofBirth.Day 的，我怎么能找到在 GetClientValidationRules 的方法，这样我就可以发射出了名的客户端？
是完全合格的型号名称

1. This is not emitting out the unobtrusive javascript validation attributes in the html, though I have implemented IClientValidatable. For testing purpose when I put the same attribute (DateTimeClientValidation) on another property in the model which was not using this editor template, then it emitted out those validation attributes, it is not emitting it out only for this editor template. Where could have I gone wrong ?
2. Regarding Validation Message span for the editor template, is it right that I put it in View only or should I put it directly in the editor template (@Html.ValidationMessageFor(m => m.MySubModel.DateofBirth))
3. In this example, am I right in the design, I have put in DateTimeClientValidationAttribute, which actually is an attribute I put on model, but this component knows a bit about UI (since it is trying to emit out the Day, Month & Year elements name to the client), this makes Model know a bit about View, am I breaking any design principles here ?
4. In DateTimeClientValidationAttribute, I am trying to emit out the day, month & year elements names to the client, so that the client script can do validations on it. But since the model property DateofBirth is in a subobject, the actual element name in the script is MySubObject.DateOfBirth, which makes the Day textbox name to be MySubObject.DateofBirth.Day, how can I find that fully qualified model name in the GetClientValidationRules method, so that I can emit out the name to the client ?

感谢您的耐心阅读了这一切，并为答案

Thanks for being patient to read out all this, and for the answers

推荐答案

经过一番努力，我做了控制工作，投入，如果它是有帮助的人在那里。

After some effort, I made the control to work, putting in if it is helpful to anybody out there.

第一点是已经控制定义为

The first point is to have the control defined as

@model DateTime?

<table class="datetime">
<tr>
    <td>@Html.TextBox("", (Model.HasValue ? Model.Value.ToString("dd") : string.Empty)) </td>
    <td class="separator">/</td>
    <td>@Html.TextBox("", (Model.HasValue ? Model.Value.ToString("MM") : string.Empty))</td>
    <td class="separator">/</td>
    <td>@Html.TextBox("", (Model.HasValue ? Model.Value.ToString("yyyy") : string.Empty))</td>
</tr>
<tr>
    <td class="label">dd</td>
    <td/>
    <td class="label">mm</td>
    <td/>
    <td class="label">yyyy</td>
</tr>
</table>

请确保你给的空字符串名称以所有的三个文本框，这迫使MVC框架产生相同的名称对应​​型号的出生日期对所有在客户端的三个文本框。此外，将在列表中的第一个文本框生成侵入式JavaScript验证参数，因为它是与模型名称的编辑控件的第一次出现。

Make sure, you give empty strings as name to all the three textboxes, this forces the MVC framework to generate same name corresponding to Model DateofBirth for all the three textboxes in the client side. Also, unobtrusive javascript validation parameters would be generated for the first textbox in the list, since it is the first occurence of a edit control with the name of the model.

在客户端，对这些文本框的任何事件触发所有相关的验证事件，因为所有这些文本框3具有相同的名称。

On the client side, on any event on any of these textboxes fires all the relevant validation events, since all these 3 textboxes have the same name.

在定期验证等所要求的顶部，......我们必须编写自定义客户端验证例程的综合值是否形成有效日期这将结合所有这三个值和检查。这可以在<一个可以实现的href=\"http://stackoverflow.com/questions/5378520/asp-net-mvc-3-client-side-unobtrusive-validation-for-editor-templates/5508709#5508709\">answer由杰夫给出。

On top of the regular validations like required,.... we have to write a custom client validation routine which would combine all these three values and checks whether the combined value forms a valid date. This can be achieved as in the answer given by Jeff.

这篇关于ASP.Net MVC 3 - 为编辑模板客户端不显眼的审定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！