2013-06-26 37 views
0

我试图在下拉列表中预选一个值。我正在使用KnockoutJS并调用web服务将值推入我的列表。但是,我无法预先选择我想要的值。非常感谢您的帮助。我也注意到没有显示放置在ko.utils.arrayFirst中的警报。谢谢!在下拉列表中预选值(选择)KnockoutJS

<body> 
<form id="form1" runat="server"> 
<asp:ScriptManager ID="ScriptManager1" runat="server"> 
    <Services> 
     <asp:ServiceReference Path="~/platform/vendors.asmx" /> 
     <asp:ServiceReference Path="~/platform/checkBooks.asmx" /> 
    </Services> 
</asp:ScriptManager> 
</form> 
<div> 
    <p> 
     Checkbooks: 
     <select data-bind="options: cb, value: choice, optionsText: 'name'"></select> 

    </p> 
</div> 

<script type="text/javascript"> 
    function errorHandler(errorObject) { 
     var errType = errorObject._exceptionType; 
     var errMsg = errorObject._message; 
     window.alert("ERROR" + errType + ":" + errMsg); 
     return false; 
    } 

    ko.observableArray.fn.find = function (prop, data) { 
     var valueToMatch = data[prop]; 
     return ko.utils.arrayFirst(this(), function (item) { 
      return (item[prop] === valueToMatch); 
     }); 
    }; 

    function viewModel() { 
     var self = this; 
     self.cb = new ko.observableArray([]); 

     self.call = function() { 
      try { 
       checkBooks.list("accounting", 2, "name:", self.retCheckBooks, errorHandler); 
      } 
      catch (ex) { 
       alert(ex.message); 
      } 
     } 
     self.retCheckBooks = function (results) { 
      for (var i = 1; i <= results.length; i++) { 
       self.cb.push({ id: i, name: results[i].shortName }); 
      } 
     } 
     var choice = { id: 4, name: "VCSTPAY" }; 
     self.choice = ko.observable(self.cb.find("id", choice)); 
    } 
</script> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     vm = new viewModel(); 
     vm.call(); 
     ko.applyBindings(vm); 
    }); 

</script> 

+0

你可以粘贴一个asmx文件输出的样本吗?没有它,我只是'checkBooks是未定义的'。 – woz

+0

嗨, 该webservice是一个非常大的文件,我指的是其中的其他cs文件。如果我尝试把所有这些都放在这里,它会令人困惑,而且非常大。我会看看我是否可以用更简单的web服务发布更好的示例。感谢您的关注。 – user1288906

+0

我不是指代码。我只想在'checkBooks'中加入一些东西来测试你的JavaScript。 – woz

回答

1

到您的数据绑定和变化选择添加optionsValue: "id"到:

self.choice = ko.observable(choice.id); 

默认情况下,KO不知道如何来比较你的选择对象中匹配value到一个options

+0

为什么要添加额外的复杂性,而不是直接从数组中传入对象,如self.choice = ko.observable(cb()[0]); ? –