Not able to get value from select list in change event

Question

I have an array of select lists (dropdown boxes) in which i am using knockouts event binding to trigger a change event. I have a function where I am trying to grab the value when a different option is selected from the drop down list, however it is always returning the first value in my observablearray. Here is a walk thru of what I am doing-

Here is the select list in my view:

  <table style="width: 100%">
     <tbody data-bind="foreach: LoanDetails">
 <tr style="border: none">
     <td>
          <select id="ddlLCLoans" tabindex="4" style="width: 120px" data-bind=" optionsCaption: 'Choose...', options: $data.FilteredLCLoans, 
optionsValue: 'LoanNum', optionsText: 'LoanNumCurrency', validationOptions: { insertMessages: false }, event: { change: $parent.LCLoanSelectionChanged }, value: $data.LCLoan, disable: $parent.disableButtons">
           </select>
      </td>
  </tr>

In my viewmodel, I have the following variable used to generate the observables:

         var buildRow = function (LCLoans) {
        var self = this;
        var obj = {               
            LCLoan: ko.observable(LCLoan).extend({ insertMessages: false, messagesOnModified: false, required: { onlyIf: validate, message: ' <BR /> LC Loans is Required' } }),

            FilteredABLoans: ko.observableArray(ABLoans())
        };

            // Add to object after obj is created so we can use that instance
            // using "this" to read the items DocStandby value
            obj.FilteredLCLoans = ko.computed(function () {

                return LCLoans().filter(function (item) {
                    return item.LoanSubType() === obj.DocStandby();
                });
            }, obj);

        obj.errors = ko.validation.group(obj);
        return obj;
    };

The select list in the view uses fields from the filteredLCLoans observable for optionsValue (LoanNum) and optionsText (LoanNumCurrency). Here is the model that populates filteredLCLoans:

         var ClientsModel = function (clientID, LoanNum, LoanSubType, LoanNumCurrency, CurrType) {
        var self = this;

        self.clientID = ko.observable(clientID);
        self.LoanNum = ko.observable(LoanNum);
        self.LoanSubType = ko.observable(LoanSubType);
        self.LoanNumCurrency = ko.observable(LoanNumCurrency);
        self.CurrType = ko.observable(CurrType);
    };

The select list also refers to the function called LCLoanSelectionChanged. This is where I am trying to grab the NEW selected value when the user selects a different option from the select list. Here is that function:

 var vm = {
        activate: activate,
        LCLoanSelectionChanged: function (row) {

            var newValue = row.FilteredLCLoans.LoanNum;
        }
  };

    return vm;

How do I get the newly selected value? If i put a breakpoint and use jQuery (var newValue = $('#ddlLCLoans option:selected').val()) I always get the first instances value of the ddlLCLoans in my view. I know the "var newValue = row.FilteredLCLoans.LoanNum" above does not work, just not sure how to code it correctly.

Answer 1

subscribing was definately the way to go. Here is code-

                    var currtype = '';
                    ko.utils.arrayForEach(LoanDetails(), function (itemLoan) {
                        itemLoan.LCLoan.subscribe(function (newLoan) {
                           alert(newLoan);
                        });
                 });

Compare that to the html in my view above and you can see this really simplified things.

Thanks Patrick Steele!