innerHTML - in Custom Widget

Q&A
1

Hi there, it’s Tuesday - a brain Dead day…

I have a Custom Widget with the following Template:

and the following Controller:

function ($scope) { 
this.innerHTML = function(){
    
    console.log("Entering this.innerHTML");

/1/ console.log(document.getElementById(“pbInput0”).innerHTML);
console.log(“Inside this.innerHTML”);
/2/ document.getElementById(“pbInput0”).innerHTML = “Update OK”;
console.log(“Leaving this.innerHTML”);

};

}

After adding it to a page, previewing it, adding data to the field and pressing TAB to loose focus.

The function executes and I get:

Entering this.innerHTML

Inside this.innerHTML
Leaving this.innerHTML

Why is line /1/ not printing the actual contents of the field anmd why is /2/ not updating the contents of the field?

Any thoughts gratefully received…as I say brain dead day…

thanks and regards
Seán

2

Hi Seán,

Do you have a reason to try editing innerHTML instead of the object’s value ?

I just tryed this :

function ($scope) {

this.innerHTML = function(){
console.log("Entering this.innerHTML");
console.log("1- "+document.getElementById("pbInput0").value);
console.log("Inside this.innerHTML");
document.getElementById("pbInput0").value = "Update OK";
console.log("Leaving this.innerHTML"); 
};
}

And it does the job for me :slight_smile: