CODEWITHSUNDEEP
javascriptjqueryknockout.js
Asiat
Asiat

Reputation: 401

jquery select option which was created using knockout

i am trying to select an option from select which i think was created using knockoutjs(but i am not sure)

<select class="styled" data-bind="options: Locations, optionsText: 'Name', value: DesiredLocat…ion: SelectLocationText(), event: { change: UpdateLocation }">

<option value="">

    Select location

</option>
<option value="">

    Some location

</option>
<option value="">

    Some location2

</option>

</select>

the whole thing is bundled in a frame, i've googled how to make jquery work in frame and now i am using it like this 

var frameDocument= $("frame[name='mainFrame']", top.document)[0].contentDocument;

i tried to do it like this:

$(frameDocument).find('.styled').val('Some location').change();

and like this:

$(frameDocument).find('.styled').children().each(function(){
     if ($(this).text()=='Some location'){
        $(this).click();
         return false;
      }
})

can anyone please help me on how to select the option i need?

Upvotes: 0

Views: 194

Answers (1)

Mateen Kajabadi
Mateen Kajabadi

Reputation: 3634

It is better to not using jquery since you are using knokout.js .

Example :https://jsfiddle.net/kyr6w2x3/82/

HTML:

<select class="styled" data-bind="options: Locations, optionsText: 'Name', optionsValue: 'Id',value: selectedLocation">

JS:

function MainViewModel() {
  var self = this ;
  self.Locations = ko.observableArray([{Name:"Location 1" , Id : 1 },{Name:"Location 2" , Id : 2 },{Name:"Location 3" , Id : 3 }]);
  self.selectedLocation = ko.observable();
  self.selectedLocation.subscribe(function(newValue){
    console.log(newValue);
  })
}

ko.applyBindings(new MainViewModel());

Upvotes: 2

Related Questions