Javascript error on previously working Template Component

  • 1
  • Problem
  • Updated 1 year ago
  • Solved
  • (Edited)
I have a Template Component that was working as-expected before, but I fear an update may have broken this. I'm getting the following Javascript error: "Uncaught TypeError: Cannot read property 'resetCanvas' of undefined"

The property is part of a javascript library I'm using to capture signatures on an HTML canvas. Did an update change the way these libraries are imported into SKUID now? Here's my code, the error is being thrown when trying to access a property that is instantiated by the library:


var element = arguments[0],
$ = skuid.$;

$(document).ready(function() {
// init signature canvas
element.jSignature();
element.jSignature("reset"); // ERROR IS THROWN HERE

// Create new signature in text field
var model = skuid.model.getModel('PDP_Detail'),
row = model.getFirstRow(),
sigField = 'Manager_Signature__c',
sigData = model.getFieldValue(row,sigField);
if(sigData !== null ) { // read back Signature data
element.jSignature("setData", "data:" + sigData);
}

// disable manager signature for individual
var pdpModel = skuid.model.getModel('PDP_Detail'),
pdpRow = pdpModel.getFirstRow();

if((pdpRow.Contact__r.Staff_Supervisor__r.FirstName != skuid.utils.userInfo.firstName &&
pdpRow.Contact__r.Staff_Supervisor__r.LastName != skuid.utils.userInfo.lastName) ||
pdpRow.Stage__c == 'Cycle Complete') {

element.jSignature("disable"); //ALSO THROWN HERE IF I COMMENT THE ABOVE ERROR OUT
}
});
Photo of Eulogio Gallo

Eulogio Gallo

  • 1,874 Points 1k badge 2x thumb
  • frustrated

Posted 2 years ago

  • 1
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Eulogio,

What version of skuid are you running?
Photo of Eulogio Gallo

Eulogio Gallo

  • 1,874 Points 1k badge 2x thumb
I'm running version 9.5
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Eulogio,

Try replacing $(document).ready(function() { with $(".nx-page").one("pageload",function() {  
Photo of Eulogio Gallo

Eulogio Gallo

  • 1,874 Points 1k badge 2x thumb
Thanks Amy, that did the trick! Can you elaborate a bit on why this change was necessary?
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Eulogio,

The $(document).ready function has always been a somewhat unstable way to wait for page load (it wasn't always consistent about when exactly it fired). You used to be able to get away with using it, but due to some changes we've made you can't sneak by with it anymore (we didn't specifically break the functionality, it's just a byproduct of other improvements). We've always encouraged people to use .nx-page, but perhaps we should have pushed it a little more. Hopefully this clarifies things a little. 
Photo of Eulogio Gallo

Eulogio Gallo

  • 1,874 Points 1k badge 2x thumb
Certainly clarifies things, thanks Amy!