send information from multiple checkbox to array K

2019-09-08 16:39发布

问题:

i have a viewmodel which has information which I am showing on the site using foreach. This is how it looks. When the person clicks the checkboxes maybe 2 of them, the observable turns true, and I have a button which says apply and when that button is clicked what I want to do is get the whole viewmodel array for the two rows which is checked or maybe 1 row which is checked and put them into one array. so I can send it to the database.

So basically I have the HTML here.

<tbody data-bind="foreach: investmentinvoicedatasintable">
  <tr>
      <td class="text-center"><span data-bind="text: $data.invoiced_total"></span></td>
      <td class="text-center"><span data-bind="text: $data.paid_total "></span></td>
      <td class="text-center">
        <a href="#" data-bind="if: $data.status == 10,  click: $root.getRepaymentInvoice"><?php echo lang("invoice_table_pay1"); ?></a>
        <span data-bind="ifnot:  $data.status == 10"><?php echo lang("invoice_table_pay1"); ?></span>  
      </td>
      <td class="text-center"><div  data-bind="if: $data.status == 10" ><input type="checkbox" data-bind="checked: $data.checkedInvoice1"/></div>
          <div  data-bind="ifnot: $data.status == 10" ></div>
      </td>
  </tr>
 </tbody>

Apply

And here is the Knockout js file.

 /* Vew model for invoices data */
self.invoicedatasintable = ko.observableArray();
        function InvoiceViewModel(root /* root not needed */, invoice) {
            var self = this;
            self.ID = invoice.ID;
            self.type_related_amount = invoice.type_related_amount;
            self.type_related_paid = invoice.type_related_paid;
            self.ORIG_ID = invoice.ORIG_ID;
            self.Fullname = invoice.Fullname;
            self.status_description = invoice.status_description;
            self.type_txt = invoice.type_txt;

            self.checkedInvoice1 = ko.observable(0);

            self.getCheckedInvoiceInfo = function(checkedinvoice){
            if(checkedInvoice1){
                return checkedinvoice;
            }else{
                return 0;
            }
        }
        };

And here is the button function which needs to check the viewmodel and get the arrays which has the checked value (true) and put them into ONE whole array.

self.getCheckedInvoices = function(){
        self.arr = ko.observableArray();
         $.each( self.getCheckedInvoiceInfo(), function (index, item) {
                if(item.checkedInvoice1 == 0){
                    return false;
                }else{
                    self.arr.push(/*only the array which has checked 1 */ );
                }

            });
            console.log(self.arr());
    }

So the problem is I am not sure how to call the invoiceViewModel to see the checked row information and also how to get only the certain rows that is CHECKED. the self.invoicedata() is the one that has all the array stored in the starting which is displaying on the table.

回答1:

Gotcha ! you are trying to loop over wrong one . self.invoicedatasintable observable has all your data

viewModel:

self.arr = ko.observableArray();
self.getCheckedInvoices = function() {
  ko.utils.arrayForEach(self.invoicedatasintable(),function(item){ //use ko.utils foreach 
    if (item.checkedInvoice1()) { //it's a Boolean flag
      self.arr.push(item);
    }
  });
    console.log(self.arr());
}

Checkbox checked property makes sure when checked/unChecked the observable binded to it gets modified .

sample here



标签: knockout.js