model - ajax投稿 - divコンテンツのロード、モデル検証が機能しない

Question

私の問題は、ajax 呼び出しを介して div の内容を読み込んでいるときに、クライアント側のモデル検証が機能しないことです。

ajax 呼び出しから返された部分ビューは、MemberInfo のフィールドを含み、MemberModel を使用するビューです。

<div id="wizard">
@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "wizard-form"}))
{
    <div data-bind="with: memberModel()">
        //content replaced thru ajax call
        <div id="wizard-content">
        </div>
    </div>
}
</div>

また、javascript モデルを使用した部分ビューのテキスト バインディングにノックアウトを使用しています。

var memberModel= ko.observable(@Html.Raw(Json.Encode(Model))),

MemberModel を、MemberInfo 部分ビューを返す ajax から呼び出されたコントローラー メソッドに投稿しています。

    var data = ko.toJSON(memberModel());

    $.ajax({
        url: url,
        type: "POST",
        data: data,
        contentType: "application/json",
        traditional: true,
        success: function (data) {
            if (data != "" && data != null) {
                $("#wizard-content").html(data);
                ko.applyBindings(memberModel, document.getElementById("wizard"));
            }
        }
    });

MemberModel は次のようなものです。

public class MemberModel
{        
    public int MemberID { get; set; }

    [Required]
    [MaxLength(20)]
    public string MemberName { get; set; }

    [DisplayName("First Name")]
    [RegularExpression(@"^[a-zA-Z\s.,'-]{2,50}$"]
    [Required]
    public string FirstName { get; set; }

    [DisplayName("Last Name")]
    [RegularExpression(@"^[a-zA-Z\s.,'-]{2,50}$"]
    [Required]
    public string LastName { get; set; }

}

Partial View のコンテンツを読み込んだ後、ノックアウト バインディングが正常に動作します。しかし、フォームのモデル検証は、レンダリングされたビューでは機能していません。