Error picture not defined

Help & Support
#1

I know this might sound basic for you, but am getting this error again & again, please can anyone help?

var Test = pc.createScript('test');

Test.attributes.add('html', {
type: 'asset', 
assetType: 'html', 
title: 'HTML Asset'
});

Test.prototype.initialize = function() {
    
    this.element = document.createElement('buttn');
    this.element.classList.add('container');
    document.body.appendChild(this.element);  
    
};


Test.prototype.bindEvents = function() {
    
    var buttn = this.element.querySelector('.buttn');
    var imag = this.app.root.element.querySelector('.imag').getPosition();
    
    
};

Test.prototype.update = function(dt) {
    
};

Html code

<img class='imag' src="/Images/Annotation"/>

<button class ='buttn' onclick="picture()">Click me!</button>
#2

So your HTML code tries to call a global picture() method that isn’t defined in your Javascript code.

Instead of doing that you can catch the onclick event directly in Javascript:

var buttn = this.element.querySelector('.buttn');
buttn.onclick = () => {
   alert('button clicked');
};

Make sure to remove it from the HTML code:

<button class ='buttn'>Click me!</button>
2 Likes
#3

Tried this method, but not working.

#4

Are you getting any error?

Try sharing a sample project so we can take a look.

1 Like
#5

Am so sorry for being inactive to see the forum page.

A few update to be known. I’ve disabled & moved the Html file since its not working.

This here is my sample test work.

Click here

Also I think I might have a bug issue: Half the button is not being displayed.