Updating selected items in a callback causing Uncaught TypeError

  • 1
  • Question
  • Updated 4 years ago
  • Answered
Hello!

I'm trying to update selected rows in a table after having saved a new record in a different model - and I'm trying to do this in one fell swoop using a mass action button on the table.

I'm using a callback because I want to reference the newly created record in the updates to the rows in the tables by inserting the ID into a lookup field on the selected records, however, when I use getSelectedItems to fetch the selected rows in the table I'm getting the following error:
Uncaught TypeError: Cannot read property 'getSelectedItems' of undefined
I've tried moving the getSelectedItems section below the callback which also didn't work. The saving of the record is working as I can console.log the ID of the saved record.

I'm sure I'm doing something daft - any ideas? Here's the snippet with the pertinent section in bold:

var params = arguments[0],
  $ = skuid.$,

  reqBooking = skuid.model.getModel('RequiringBooking');


var newBooking = skuid.model.getModel('NewBooking');
var listBooking = skuid.model.getModel('Bookings');

newBooking.save({callback: function(result){

  if (result.totalsuccess) {

    var rowNewBooking = newBooking.getFirstRow();

    $.each(arguments[0].list.getSelectedItems(),function(i,item){

      reqBooking.updateRow(item.row,{
        'Booking__c': rowNewBooking.Id,
        'Desired_required_or_completed__c': 'Enrolled',
        'Certification_Date__c': rowNewBooking.Date_and_Time_of_Course__c,
        'Location__c': rowNewBooking.Location__c

      });

    });

    reqBooking.save();
    reqBooking.updateData();
    listBooking.updateData();

  } else {

    console.log(result.insertResults[0]);

  }

}});
Photo of Louis Skelton

Louis Skelton

  • 4,786 Points 4k badge 2x thumb
  • moderately ecstatic

Posted 4 years ago

  • 1
Photo of Moshe Karmel

Moshe Karmel, Champion

  • 8,646 Points 5k badge 2x thumb
You can probably get a good idea of what you have available to you by console logging everything.
I would log arguments[0], arguments[0].list and arguments[0].list.getSelectedItems(), just to see what you're getting back. Also I have used the getSelectedItems function with the below syntax, it might just work...
skuid.$.map(arguments[0].list.getSelectedItems(),function(item){ 
 reqBooking.updateRow(item.row,{
'Booking__c': rowNewBooking.Id, 'Desired_required_or_completed__c': 'Enrolled', 'Certification_Date__c': rowNewBooking.Date_and_Time_of_Course__c, 'Location__c': rowNewBooking.Location__c  
});
}); 
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,004 Points 20k badge 2x thumb
The problem is with your use of arguments[0] inside the callback function --- within the callback function, arguments[0] refers to the save result object, which does not have a list property like you're looking for. You need to store a reference to the list variable at the top of your snippet so that you can safely reference it from within your save callback function:


var params = arguments[0],	
   list = params.list,
   reqBooking = skuid.model.getModel('RequiringBooking'),
   newBooking = skuid.model.getModel('NewBooking'),
   listBooking = skuid.model.getModel('Bookings'),
   $ = skuid.$;
newBooking.save({callback: function(result){
  if (result.totalsuccess) {
    var rowNewBooking = newBooking.getFirstRow();
    $.each(list.getSelectedItems(),function(i,item){
      reqBooking.updateRow(item.row,{
        'Booking__c': rowNewBooking.Id,
        'Desired_required_or_completed__c': 'Enrolled',
        'Certification_Date__c': rowNewBooking.Date_and_Time_of_Course__c,
        'Location__c': rowNewBooking.Location__c
      });
    });
    reqBooking.save();
    reqBooking.updateData();
    listBooking.updateData();
  } else {
    console.log(result.insertResults[0]);
  }
}});
Photo of Louis Skelton

Louis Skelton

  • 4,786 Points 4k badge 2x thumb
Brilliant, that makes a lot of sense. I've just tested it and it works just as I'd hoped.

The only other thing now is that I'm trying to update a table with the 'Bookings' model after the save (listBooking.updateData();) and this doesn't seem to be happening - any ideas why?
Photo of Louis Skelton

Louis Skelton

  • 4,786 Points 4k badge 2x thumb
(the table is beneath the popup - I should add)
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,004 Points 20k badge 2x thumb
You need to wait for your reqBooking model to finish saving before you call reqBooking.updateData() --- and check that the save operation was a total success, otherwise your reqBooking updateData operation will fail, because you can't call updateData on models that have unsaved changes (because then the unsaved data would get thrown out and lost).


So change these lines:

reqBooking.save();
reqBooking.updateData();
listBooking.updateData();

to something like this:

reqBooking.save({callback:function(result){
   if (result.totalsuccess) {
      skuid.model.updateData([reqBooking,listBooking]);
   }
}});

The other thing I changed was to use the multi-model version of updateData, which is much more efficient, as it allows for multiple models to be requeried in a single call to the server.
Photo of Louis Skelton

Louis Skelton

  • 4,786 Points 4k badge 2x thumb
Moshe, Zach - As ever, thanks for your help! I think I'll need to use the multi-model version of updateData in a few other places too by the looks of things.

Cheers!