3

私は、knockout.jsライブラリとknockout.mapping.jsライブラリをMVC4アプリケーションで機能させようとしています。コントローラーを使用してビューを生成しています。かみそりのビューはモデルをJSON文字列に変換しており、マッピングプラグインを使用してMVでJSONモデルを取得しています。その部分はすべて正常に機能します。コントローラのモデルにいくつかの値を追加すると、それらは私のビューに表示されます。私が抱えている問題は、WebApiコントローラーを返送することです。そこに到達すると、シリアル化可能なモデルに変換されません。これが私が持っているものです：

<script type="text/javascript" src="/Scripts/knockout-2.1.0.debug.js"></script>
<script type="text/javascript" src="/Scripts/knockout.mapping-latest.debug.js"></script>
<script type="text/javascript">
function SearchModel() {
    var self = this;
    var baseUri = '/Api/searchsubscriber/FindSubscriber';

    self.search = function (formElement) {
        debugger;
        var myJSONString = JSON.stringify(ko.mapping.toJS(formElement));
        alert(myJSONString);
        $.ajax({
            type: "POST",
            url: baseUri,
            data: myJSONString
        }).done(updateSearchResults);

    };

    updateSearchResults = function (data) {
        debugger;
        var jsonString = JSON.stringify(data);
        alert(jsonString);
    };
};
$(function () {
    debugger;
//in my actualy view it looks like this
//var jsonModel = '@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model))';
    var jsonModel = '{"SubscriberNum":null,"PersonCode":null,"ClientCode":null,"LastName":"TEST","FirstName":"H","MI":null,"DOB":null,"StartDt":null,"EndDt":null,"GroupNum":null}';
    var mvcModel = ko.mapping.fromJSON(jsonModel);

    var myViewModel = new SearchModel();
    var g = ko.mapping.fromJS(myViewModel, mvcModel);

    ko.applyBindings(g);
});
</script><code>

これは私のモデルです

[Serializable]
public class SearchSubscriberFields //: SearchSubscriberResults
{
   //public List<SearchSubscriberResults> Results { get; set; }
   public string SubscriberNum { get; set; }
   public string PersonCode { get; set; }
   public string ClientCode { get; set; }
   public string LastName { get; set; }
   public string FirstName { get; set; }
   public string MI { get; set; }
   public string DOB { get; set; }
   public string StartDt { get; set; }
   public string EndDt { get; set; }
   public string GroupNum { get; set; }
}

これは私のApiControllerです

[Authorize]
public class SearchSubscriberController : ApiController
{
    MyService _service = new MyService();

    [HttpPost]
    public SearchSubscriberFields FindSubscriber(SearchSubscriberFields search)
    {
        if (search != null)
        {
            SearchSubscribersRequest request = new SearchSubscribersRequest();

            request.Credentials = new Credentials() { Username = User.Identity.Name };

            request.SubscriberNum = Utility.FormatString(search.SubscriberNum).ToUpper();
            request.PersonCode = Utility.FormatString(search.PersonCode).ToUpper();
            request.ClientCode = Utility.FormatString(search.ClientCode).ToUpper();
            request.LastName = Utility.FormatString(search.LastName).ToUpper();
            request.FirstName = Utility.FormatString(search.FirstName).ToUpper();
            request.MI = Utility.FormatString(search.MI).ToUpper();

            SearchSubscribersResponse response = _service.SearchSubscribers(request);

            if (response.Errors.Count < 1)
            {
                return search;
            }
       }
        return search;
    }
}

だから、私が見たすべての例から、これはうまくいくはずです。APIコントローラーのオブジェクトをに変更するとFindSubscriber(JObject search)、JSON文字列を取得していることがわかります。Fiddlerは、JSON文字列を送信していることを示しています。フィドラーから：

POST http://localhost:60248/Api/searchsubscriber/FindSubscriber HTTP/1.1
Accept: */*
Content-Type: application/x-www-form-urlencoded
X-Requested-With: XMLHttpRequest
Referer: http://localhost:60248/Subscriber/Search
Accept-Language: en-US,es-DO;q=0.5
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
Host: localhost:60248
Content-Length: 157
Connection: Keep-Alive
Pragma: no-cache
{"SubscriberNum":null,"PersonCode":null,"ClientCode":null,"LastName":"TEST","FirstName":"H","MI":null,"DOB":null,"StartDt":null,"EndDt":null,"GroupNum":null}

コントローラでSearchSubscriberFieldsオブジェクトに戻ることができる結果が得られません。

どんなアイデアでも大歓迎です。

4

2 に答える 2

1

ko.mapping.toJSONを使用する必要があります。また、jQuery.Ajaxを正しく構成する必要があります。これで、htmlフォームのように投稿され、MVCコントローラーはそれを理解しません。

このようなものが機能するはずです

MyApp.utils = {
    post: function (url, data, success) {
        $.ajax({
            url: url,
            type: "POST",
            dataType: "JSON",
            contentType: "application/json; charset=UTF-8",
            data: ko.mapping.toJSON(data),
            success: success
        });
    }
};
于 2012-12-12T15:18:32.057 に答える
1

私の問題は、サーバーモデルに[Serializable]属性があり、レイザービューでシリアル化すると、バッキングフィールドもシリアル化されることであることがわかりました。それは明らかなはずでしたが、私はそれを逃しました。したがって、モデルをポストバックすると、それらのバインディングフィールドもポストバックされるため、モデルにマップできなくなります。これをGlobal.asmxに追加しました

        //This sets the JSON serializer to ignore the backing fields
        JsonSerializerSettings jSettings = new Newtonsoft.Json.JsonSerializerSettings();
        GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings = jSettings;
于 2012-12-26T15:41:58.957 に答える