javascript - Knockout for MVC. Child Dropdownlist doesn't load the model data at first time -

model:

public class storedata {     public selectlist regions { get; set; }     public selectlist groups { get; set; } } 

client:

function cascadingddlviewmodel() {     this.groups = ko.observablearray([]); }  var objvm = new cascadingddlviewmodel(); ko.applybindings(objvm); 

html:

@html.dropdownlist("gid", (selectlist)model.groups, new { id = "ddlgroup", data_bind = "options: groups, optionstext: 'text', optionsvalue: 'value'" }) 

jquery loading dropdown

$("#ddlgroup").change(function () {     var ddl = this;     var id = ddl.options[ddl.selectedindex].value;     var url = $(ddl).attr("data-url");     $.getjson(url, { id: id }, function (data) { objvm.stores(data); }); }); 

at first time after load data in dependent dropdownlist data absent. after choosing item in parent list ok.

problem comes after page reload. how bind data after page load?

i decided problem using 1 line

$('#ddlregion').trigger('change'); 

all working correctly now. have 1 problem. not full understand moment. how can use mvc model set defaul data after loading. data have been formed using depending.

storedata store = new storedata();              store.regions = _datamanager.monitorings.getregionsselectlist(region_id, true);             store.region_id =  (region_id == -1 ? (int)store.regions.selectedvalue : region_id);              store.groups = _datamanager.monitorings.getstoregroupsselectlist(store.region_id, group_id);             store.group_id = group_id; 

earlier used method:

    @html.dropdownlist("sid", (selectlist)model.stores, new { id = "ddlstore" }) 

now:

    @html.dropdownlist("sid", (selectlist)model.stores, new { id = "ddlstore", data_bind = "options: stores, optionstext: 'text', optionsvalue: 'value'" }) 

i understand must set client model data. don't understand how it? array empty:

this.groups = ko.observablearray([]);