2012-02-28 19 views
6

次のコードがあります。クライアントを呼び出して、情報でKnockOutJSビューモデルを更新しているようです。ページ読み込み時にGetOuting()が呼び出され、正しい情報がviewmodelに渡されます。 Chromeは開発者ツールにJSエラーを表示しません。その時点から、トラブルシューティングの方法を理解することができません。どんな助けもありがとうございます。さらに、デバッグの際 SignalRハブノックアウトViewModelでSignalRを実装しようとしています

public class Outings : Hub 
{ 
    private static Dictionary<Guid, OutingViewModel> outings = new Dictionary<Guid, OutingViewModel>(); 

    public void GetOuting(string id) 
    { 
     var guidID = new Guid(id); 
     bool containsOuting = outings.ContainsKey(guidID); 
     if (!containsOuting) 
     { 
      var outingAccessor = new OutingAccessor(); 
      outingAccessor.ID = guidID; 
      outingAccessor.Load(); 
      var outingVM = new OutingViewModel(outingAccessor); 
      outings.Add(guidID, outingVM); 
     } 
     var outing = outings[guidID]; 
     this.Clients.updateOuting(outing); 
    } 

    public void SaveOuting(string outingNumber, OutingViewModel outing) 
    { 
     var guidID = new Guid(outingNumber); 
     outings[guidID] = outing; 
     this.Clients.updateOuting(outing); 
    } 
} 

のViewModel

public class OutingViewModel 
{ 
    public OutingViewModel(OutingAccessor outingAccessor) 
    { 
     ID = outingAccessor.ID; 
     OutingNumber = outingAccessor.OutingNumber; 
     var outingGeneralAccessor = new OutingGeneralAccessor(); 
     var outingGeneral = outingGeneralAccessor.GetOutingGeneralByOutingID(outingAccessor.ID); 
     this.OutingName = outingGeneral.Name; 
    } 
    public Guid ID { get; set; } 
    public int OutingNumber { get; set; } 
    public string OutingName { get; set; } 
} 

HTML + JavaScriptの

@model string 
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"> </script> 
<script src="@this.Url.Content("~/Scripts/jquery.signalR.js")" type="text/javascript">  </script> 
<script src="@this.Url.Content("~/Scripts/knockout.js")" type="text/javascript"> </script> 
<script type="text/javascript" src="/signalr/hubs"> </script> 
<script type="text/javascript"> 
    $(function() { 
     function outingDataViewModel() { 
      this.hub = $.connection.outings; 
      this.ID = ko.observable(); 
      this.OutingNumber = ko.observable(); 
      this.OutingName = ko.observable(); 
      //Initializes the view model 
      this.init = function() { 
       this.hub.getOuting('@this.Model'); 
      }; 
      this.hub.updateOuting = function(data) { 
       ID(data.ID); 
       OutingName(data.OutingName); 
       OutingNumber(data.OutingNumber); 
      }; 
     } 
     var vm = new outingDataViewModel(); 
     ko.applyBindings(vm); 
     // Start the connection 
     $.connection.hub.start(function() { vm.init(); }); 
    }); 
</script> 
<h1>Outing Number</h1> 
<div id="OutingSummary"> 
    <div data-bind="text:OutingNumber"></div> 
    <div data-bind="text:OutingName"></div> 
</div> 

は、ラインにあるように見える

ID(data.ID); 
OutingName(data.OutingName); 
OutingNumber(data.OutingNumber); 

それをトイレ私がIDを設定しようとすると "undefined_method"の例外が出てきます。それは誰にも意味がありますか?

+0

ノックアウトの前にjQueryを参照する必要はありませんか? –

+0

KnockoutJSでjQeryテンプレートを使用している場合は、jQueryが必要です。それ以外の場合は、KnockoutJSは依存性がありません。 –

+0

良いキャッチですが、これは実際には部分的なビューで、マスタービューにはjqueryリファレンスが含まれています。コードスニペットにjqueryリファレンスを追加して、偽陽性の回答者を増やさないようにしました。私はすぐに例を修正します。 – PlTaylor

答えて

8

問題のある箇所は正しいですか。サーバがupdateOutingメソッドを呼び出して、あなたがコードを実行すると:

ID(data.ID); 
OutingName(data.OutingName); 
OutingNumber(data.OutingNumber); 

それはどこID、OutingNameとOutingNumberを検索する場所を知っていません。これらがビュー・モデル・オブジェクトに存在することを指定する必要があります。あなたの問題を解決する1つの解決策は、javascriptコードを次のように変更することです:

<script type="text/javascript"> 
    $(function() { 
     function outingDataViewModel() { 
      var self = this; 
      self.hub = $.connection.outings; 
      self.ID = ko.observable(); 
      self.OutingNumber = ko.observable(); 
      self.OutingName = ko.observable(); 
      //Initializes the view model 
      self.init = function() { 
       self.hub.getOuting('@Guid.NewGuid().ToString()'); 
      }; 
      self.hub.updateOuting = function (data) { 
       self.ID(data.ID); 
       self.OutingName(data.OutingName); 
       self.OutingNumber(data.OutingNumber); 
      }; 
     } 
     var vm = new outingDataViewModel(); 
     ko.applyBindings(vm); 
     // Start the connection 
     $.connection.hub.start(function() { vm.init(); }); 
    }); 
</script> 

希望すると助かります!

+0

私は朝にその最初のことを試みます。それは本当に良いように見えます。 – PlTaylor

+0

それはうまくいきました。ご協力いただきありがとうございます。 – PlTaylor

関連する問題