-1

ASP.NET MVC 4があり、検証属性を使用してクライアント側とサーバー側の検証を使用しています。

フォームは、次のようにajaxで送信する前に適切に検証されます。

function ValidateFormAndAjaxSubmit(formId, callingElement) {

    if (IsNotDblClick(callingElement.id)) {
        var _form = $("#" + formId);

        var validator = _form.validate();
        var anyError = false;

        _form.find("input").each(function () {
            if (!validator.element(this)) { // validate every input element inside this step
                anyError = true;
            }
        });

        if (anyError) {
            window.latestClick = '';
            return false; // exit if any error found    
        }

        $.post(_form.attr("action"), _form.serialize(), function (data) {

            if (data.Success) {

            }
            else {

            }

            alert("Win");
            window.latestClick = '';
            //check the result and do whatever you want
        })
    }
}

フォームは次のようになります：

@using (Html.BeginForm("JEdit", "Post", FormMethod.Post, new { id = "frmEditPost" }))
{
    @Html.ValidationSummary(true)
    ...
}

サーバーサイドで追加の検証が行われ、これは次のような戻りクラスに格納されます。

public class JEditResult
    {
        public Boolean Success = false;
        public string TitleErrMessage;
        public string TextErrMessage;
        public string LinkErrMessage;
        public string TagErrMessage;
        public string OtherErrMessage;
    }

次に、これらの検証を、クライアントで検証されたかのようにフォームに入力する必要があります。どうすればよいですか？

4

1 に答える 1

1

次の拡張メソッドを使用します。

public static JsonResult JsonValidation(this ModelStateDictionary state, JsonRequestBehavior behavior = JsonRequestBehavior.DenyGet) {
    var result = new JsonResult {
        Data = new {
            success = false,
            Tag = "ValidationError",
            State = from e in state
                    where e.Value.Errors.Count > 0
                    select new {
                        Name = e.Key,
                        Errors = (e.Value.Errors.Select(x => x.ErrorMessage)
                            .Concat(e.Value.Errors.Where(x => x.Exception != null).Select(x => x.Exception.Message)))
                            .Where(x => !String.IsNullOrEmpty(x)).Select(x => x)
                    }
        }
    };
    result.JsonRequestBehavior = behavior;
    return result;
}

次に、コード内で次のように使用します。

if (ModelState.IsValid == false) {
    Response.StatusCode = 400;
    return ModelState.JsonValidation();
}

私が使用する標準の js コードもいくつかあります。

// JSON validation
function validateResponse(form, response) {
    var data = getResponseValidationObject(response);
    if (!data) return true;

    var validator = form.validate();
    var container = form.find("[data-valmsg-summary=true]");
    var list = container.find("ul");
    if (!list) return;

    container.addClass("validation-summary-errors").removeClass("validation-summary-valid");
    list.empty().show();
    $.each(data.State, function (i, item) {
        list.append("<li>" + item.Errors.join("</li><li>") + "</li>");
    });
    return false;
}

// JSON validation
function getResponseValidationObject(response) {
    if (response && response.Tag && response.Tag == "ValidationError")
        return response;
    return null;
}

次に、ajax の投稿内で、戻り応答の有効性を確認します。

var json = $.parseJSON(response.responseText);
var isValid = validateResponse($("#form"), json);
// Do something here...

このvalidateResponse関数は、フォーム検証の概要にエラーを自動的に追加します (エラーがあると仮定します)。

于 2012-12-30T15:53:30.850 に答える