Рендеринг частичного представления MVC3 не включает атрибуты проверки данных - PullRequest
11 голосов
/ 20 сентября 2011

У меня есть довольно прямолинейная форма, которая отображает личные данные как частичное представление в центре формы.Я не могу получить подтверждение на стороне клиента для работы с этой формой.Я начал гоняться за генерацией html и нашел то же поле модели, отображаемое в стандартной форме и частичное представление.

Я заметил, что элементы ввода правильно заполнены при первом вызове, @ html.partial,следующее происходит только тогда, когда частичное представление перезагружается с помощью запроса AJAX.

Сначала заголовок моего частичного представления, это внутри Ajax.BeginForm на главной странице.

@model MvcMPAPool.ViewModels.EventRegistration
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")"         type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function ()
{
    $(".phoneMask").mask("(999) 999-9999");
});
</script>

@{
    var nPhn = 0;
    var dTotal = 0.0D;
    var ajaxOpts = new AjaxOptions{ HttpMethod="Post", UpdateTargetId="idRegistrationSummary", OnSuccess="PostOnSuccess" };
    Html.EnableClientValidation( true );
    Html.EnableUnobtrusiveJavaScript( true );
}

Здесьэто разметка бритвы от частичного вида:

@Html.ValidationMessageFor(model=>Model.Player.Person.Addresses[0].PostalCode)
<table>
    <tr>
        <td style="width:200px;">City*</td>
        <td>State</td>
        <td>Zip/Postal Code</td>
    </tr>
    <tr>
        <td>@Html.TextBoxFor(p=>Model.Player.Person.Addresses[0].CityName, new { style="width:200px;", maxlength=50 })</td>
        <td>
        @Html.DropDownListFor(p=> Model.Player.Person.Addresses[0].StateCode
                                 , MPAUtils.GetStateList(Model.Player.Person.Addresses[0].StateCode))</td>
        <td>
        <div class="editor-field">
        @Html.TextBoxFor(p=>Model.Player.Person.Addresses[0].PostalCode, new { style="width:80px;", maxlength=10 })
        </div>
        </td>
    </tr>
</table>

Вот поле визуализации из частичного вида:

        <td>
        <div class="editor-field">
        <input id="Player_Person_Addresses_0__PostalCode" maxlength="10" name="Player.Person.Addresses[0].PostalCode" style="width:80px;" type="text" value="" />
        </div>
        </td>

Вот то же поле модели, отображаемое в стандартном виде:

        <div class="editor-field">            
            <input data-val="true" data-val-length="The field Postal/Zip Code must be a string with a maximum length of 10." data-val-length-max="10" data-val-required="Postal or Zip code must be provided!" id="Person_Addresses_0__PostalCode" maxlength="10" name="Person.Addresses[0].PostalCode" title="Postal/Zip Code is required" type="text" value="" />       
            <span class="field-validation-valid" data-valmsg-for="Person.Addresses[0].PostalCode" data-valmsg-replace="true"></span>        
        </div>

Обратите внимание, что при частичной визуализации в элементе ввода отсутствуют атрибуты data-val-xxx.

Это правильно?Я не понимаю, как валидация на стороне клиента могла бы работать без этих атрибутов, или я что-то здесь упускаю?

Ответы [ 2 ]

18 голосов
/ 20 сентября 2011

Для создания ненавязчивых атрибутов проверки должен существовать FormContext. Добавьте следующее в верхней части вашего частичного представления:

if (this.ViewContext.FormContext == null) 
{
    this.ViewContext.FormContext = new FormContext(); 
}
9 голосов
/ 07 февраля 2012

Если вы хотите, чтобы теги проверки данных были там, вы должны быть в FormContext. Следовательно, если вы динамически генерируете части своей формы, вам нужно включить следующую строку в ваше частичное представление:

@{ if(ViewContext.FormContext == null) {ViewContext.FormContext = new FormContext(); }}

Затем вам нужно убедиться, что вы динамически перепривязываете свою ненавязчивую проверку каждый раз, когда добавляете / удаляете элементы:

$("#form").removeData("validator");
$("#form").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse("#form");
...