2014-11-25 51 views
0

使用基因敲除我试图将3个下拉列表与由调用WebAPI的Ajax方法返回的数据绑定。使用包含3 IList的JSON对象的3个下拉列表的基因敲除映射<CustomType>

接收到的JSON数据是类型,其中calsses定义如下

public class MasterItem 
{ 
    public int MasterItemID { get; set; } 
    public string MasterItemName { get; set; } 
} 


public class ReconDefMasters 
    { 
     public IList<MasterItem> servFileFormat { get; set; } 
     public IList<MasterItem> mersRev { get; set; } 
     public IList<MasterItem> mersFileType { get; set; } 
} 

如何写这个ko.mapping“ReconDefMasters”?

我能够通过返回IList来实现结果,但它需要3次独立的WebAPI调用,并试图通过返回3个IList的组合对象来避免这种多次调用。

我称为下面的链接,但在修改逻辑3下拉列表一起

http://jsfiddle.net/jearles/CGh9b/

Poblem with getting multidimensional array (object) observable in KnockoutJS

不成功这是我单的IList <代码>方法

var apipath = 'http://example.com'; 

ko.validation.init({ 
    registerExtenders: true, 
    messagesOnModified: true, 
    insertMessages: false 
}); 

function Master(data) { 
    var self = this; 
    self.FormatId = ko.observable(data.MasterItemID); 
    self.FormatName = ko.observable(data.MasterItemName); 
} 

var RuleDefVM = function (url) { 
    var self = this; 

    self.ServFileFormat = ko.observableArray(); 
    self.selectedTemplate = ko.observable(); 


    self.RuleDef = function() { 

     jQuery.support.cors = true; 

     $.ajax({ 
      type: "GET", 
      url: url, 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function (response) { 
       if (response != "") { 
        $(response).each(function (index, element) { 
         self.ServFileFormat.push(new Master(element)); 

        }); 

       } 
      } 
     });   
    }; 
} 
var urlRuleDef = apipath + '/api/RuleDef/'; 
var viewModelRuleDef = new RuleDefVM(urlRuleDef); 
viewModelRuleDef.RuleDef(); 
+0

A您是否问过如何将您的'ReconDefMasters'对象序列化为JSON,或者如何处理客户端上的JSON或两者? – 2014-11-25 11:36:56

+0

如何处理客户端上的JSON - 将Knockout绑定到3个下拉列表 – user3122606 2014-11-25 12:21:49

+1

您的模型需要有3个'observableArrays',每个'List'一个 - 然后您可以将它们单独绑定到您的模板等 – 2014-11-25 12:50:54

回答

0
function Master(data) { 
    var self = this; 
    self.FormatId = ko.observable(data.MasterItemID); 
    self.FormatName = ko.observable(data.MasterItemName); 
} 


    selfDef.ServFileFormat = ko.observableArray(); 
    selfDef.MERSRev = ko.observableArray(); 
    selfDef.MERSFileType = ko.observableArray(); 


    self.selectedTemplate1 = ko.observable(); 
    self.selectedTemplate2 = ko.observable(); 
    self.selectedTemplate3 = ko.observable(); 


     jQuery.support.cors = true; 
     $.ajax({ 
      url: url, 
      type: "GET", 
      dataType: "json", 
      contentType: "application/json; charset=utf-8", 
      cache: false, 
      success: function (response) { 
       if (response != "") { 
        $(response).each(function (index, element) { 
         $(element.servFileFormat).each(function (index,element) { 
          selfDef.ServFileFormat.push(new Master(element)); 
         }); 
         $(element.mersRev).each(function (index, element) { 
          selfDef.MERSRev.push(new Master(element)); 
         }); 
         $(element.mersFileType).each(function (index, element) { 
          selfDef.MERSFileType.push(new Master(element)); 
         }); 

        }); 

       } 
      } 

     }); 


<select data-bind="options: ServFileFormat, value:selectedTemplate1, optionsText: 'FormatName' "class="dropdown"></select> 

<select data-bind="options: MERSRev, value:selectedTemplate2, optionsText: 'FormatName' "class="dropdown"></select> 
<select data-bind="options: MERSFileType, value:selectedTemplate3, optionsText: 'FormatName' "class="dropdown"></select> 
相关问题