javascript - Knockout value binding for select list works intermittently -


i have select list bound options object being called via web api. object given below.

[{"id":1,"status":"unallocated"},{"id":2,"status":"allocated"},{"id":3,"status":"checked out"},{"id":4,"status":"qa1"},{"id":5,"status":"qa2"},{"id":6,"status":"qa3"},{"id":7,"status":"qa4"},{"id":8,"status":"qa5"},{"id":9,"status":"invalidated"},{"id":10,"status":"delivered"},{"id":11,"status":"ready review"},{"id":12,"status":"reviewed"},{"id":13,"status":"ready print"},{"id":14,"status":"edited"},{"id":15,"status":"archived"}]

the select list defined

<select id="statusname" name="statusname" data-bind="options:status,optionstext:'id',optionsvalue:'id','optionscaption':'all status...',value:selectedstatus"></select> 

the status needs selected coming via query string. grab query string value, populate selectedstatus observable , bind view model in document.ready, this

 var deliveredtransvm = function () {    var selectedstatus = ko.observable();   //get status   //other functions   return{      selectedstatus:selectedstatus       }  }();    $(function(){   // id url  var tid= getfromurl('status');   if (tid!=null && tid!='' && tid!='undefined')  {     deliveredtransvm.selectedstatus(tid);   }    ko.applybindings(deliveredtransvm);   }); 

i cannot create fiddle since cannot put query string in there. t

the problem select gets values set intermittently. works , @ other times selectedstatus undefined shown in image below. have logged observable prior binding , populated. have tried setting after ko.applybindings same issue.

i have played removing optionsvalue in select doesnt help. ko.applybidnings being fired after ajax promise resolved.any explanations appreciated

enter image description here

well, code works... suspect else in code coming through , stepping on value.

btw, can fiddle this... mock function.

var statuses = [{"id":1,"status":"unallocated"},{"id":2,"status":"allocated"},{"id":3,"status":"checked out"},{"id":4,"status":"qa1"},{"id":5,"status":"qa2"},{"id":6,"status":"qa3"},{"id":7,"status":"qa4"},{"id":8,"status":"qa5"},{"id":9,"status":"invalidated"},{"id":10,"status":"delivered"},{"id":11,"status":"ready review"},{"id":12,"status":"reviewed"},{"id":13,"status":"ready print"},{"id":14,"status":"edited"},{"id":15,"status":"archived"}];  var deliveredtransvm = function () {   var status = ko.observablearray(statuses);   var selectedstatus = ko.observable();    return{      selectedstatus:selectedstatus,       status:status       }  }();  function getfromurl(x) {     return 11; }   $(function(){   // id url  var tid= getfromurl('status');   if (tid!=null && tid!='' && tid!='undefined')  {      console.log(tid);     deliveredtransvm.selectedstatus(tid);   }    ko.applybindings(deliveredtransvm);   }); 

http://jsfiddle.net/brettwgreen/ov1nqxux/


Comments