<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Uncaught TypeError: this.sendNotification is not a function at HTMLParagraphElement.]]></title><description><![CDATA[<pre><code>Module.register("MMM-Test", {
  defaults: {},
  start: function (){},

getDom: function() {
  var element = document.createElement("div")
  element.className = "myContent"
  element.innerHTML = "Hello, World! " + this.config.foo
  var subElement = document.createElement("p")
  subElement.innerHTML = "Test" 
  subElement.id = "TEST"
  element.appendChild(subElement)
  return element
},


notificationReceived: function(notification, payload, sender) {
  switch(notification) {
    case "DOM_OBJECTS_CREATED":
    var elem = document.getElementById("TEST")
    elem.addEventListener("click", function(){
    elem.innerHTML = "TEST2"
    this.sendNotification('CHANGE_POSITIONS', 
    modules = {
        'clock':{
            visible: 'true',
            position: 'top_left',
            },
       }
      )
    })     
      break
  }
},


</code></pre>
<p dir="auto">The position of the clock was top_right. As a result of the execution, clicking on a letter changes the letter but does not change the position of the clock module. What is the reason?</p>
<p dir="auto">this.sendNotification('CHANGE_POSITIONS—) is MMM-Dynamic-Modules</p>
<p dir="auto">When clicked on the console, the following words appeared:<br />
MMM-Test.js:23 Uncaught TypeError: this.sendNotification is not a function<br />
at HTMLParagraphElement.</p>
]]></description><link>https://forum.magicmirror.builders/topic/9823/uncaught-typeerror-this-sendnotification-is-not-a-function-at-htmlparagraphelement</link><generator>RSS for Node</generator><lastBuildDate>Wed, 20 May 2026 22:37:09 GMT</lastBuildDate><atom:link href="https://forum.magicmirror.builders/topic/9823.rss" rel="self" type="application/rss+xml"/><pubDate>Mon, 18 Feb 2019 05:36:29 GMT</pubDate><ttl>60</ttl><item><title><![CDATA[Reply to Uncaught TypeError: this.sendNotification is not a function at HTMLParagraphElement. on Mon, 18 Feb 2019 12:56:34 GMT]]></title><description><![CDATA[<p dir="auto">Try this;</p>
<pre><code class="language-js">notificationReceived: function(notification, payload, sender) {
  switch(notification) {
    case "DOM_OBJECTS_CREATED":
    var elem = document.getElementById("TEST")
    elem.addEventListener("click", () =&gt; {
    this.sendNotification('CHANGE_POSITIONS', ...
...
},
</code></pre>
<p dir="auto">Or,</p>
<pre><code class="language-js">notificationReceived: function(notification, payload, sender) {
  switch(notification) {
    case "DOM_OBJECTS_CREATED":
    var elem = document.getElementById("TEST")
    var that = this 
    elem.addEventListener("click", function() {
    that.sendNotification('CHANGE_POSITIONS', ...
...
},
</code></pre>
]]></description><link>https://forum.magicmirror.builders/post/52642</link><guid isPermaLink="true">https://forum.magicmirror.builders/post/52642</guid><dc:creator><![CDATA[[[global:former-user]]]]></dc:creator><pubDate>Mon, 18 Feb 2019 12:56:34 GMT</pubDate></item><item><title><![CDATA[Reply to Uncaught TypeError: this.sendNotification is not a function at HTMLParagraphElement. on Mon, 18 Feb 2019 12:51:15 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/emrhssla" aria-label="Profile: emrhssla">@<bdi>emrhssla</bdi></a> said in <a href="/post/52624">Uncaught TypeError: this.sendNotification is not a function at HTMLParagraphElement.</a>:</p>
<p dir="auto">the word ‘this’ has a defined meaning… context of THIS object at the time of execution.</p>
<p dir="auto">the issue is that at that moment in time the code is inside the  eventhandler, NOT your module. (the routine that did the addEventListener() ended minutes ago)  so it has its OWN ‘this’ context…    there are three ways to get back to the module context</p>
<ol>
<li>
<p dir="auto">declare a global variable (self)  and use that so the execution processor knows what you want, watch out, global variables are global, names may collide across modules…</p>
</li>
<li>
<p dir="auto">use a different function   declaration   () =&gt; {} instead of function(){}…  tells the execution processor to use the surrounding context …these are called Arrow functions… Arrow functions do not have their own ‘this’<br />
BUT you need to pass params on the function call to get access to the element where the event happened</p>
</li>
<li>
<p dir="auto">use the bind() operator to add the outer module context to the  event context<br />
function(){}.bind({inner_varname:outer_varname)…   .bind({module_this:this})</p>
</li>
</ol>
<blockquote>
<p dir="auto">elem.addEventListener(“click”,<br />
function(){<br />
elem.innerHTML = “TEST2”<br />
this.sendNotification(‘CHANGE_POSITIONS’,<br />
modules = {<br />
‘clock’:{<br />
visible: ‘true’,<br />
position: ‘top_left’,<br />
},<br />
}<br />
)<br />
}<br />
)</p>
</blockquote>
<p dir="auto">you will have to research these and decide how to do it…  each has a different implementation and code maintenance impact</p>
]]></description><link>https://forum.magicmirror.builders/post/52640</link><guid isPermaLink="true">https://forum.magicmirror.builders/post/52640</guid><dc:creator><![CDATA[sdetweil]]></dc:creator><pubDate>Mon, 18 Feb 2019 12:51:15 GMT</pubDate></item><item><title><![CDATA[Reply to Uncaught TypeError: this.sendNotification is not a function at HTMLParagraphElement. on Mon, 18 Feb 2019 11:33:49 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/emrhssla" aria-label="Profile: emrhssla">@<bdi>emrhssla</bdi></a> This is a common issue for most modules, most people solve the issue by adding “self = this;” as the first line of the function they require the send notification in. Personally I declare a global variable outside of the module; e.g.:</p>
<pre><code>var Test;
Module.register("MMM-Test", {
</code></pre>
<p dir="auto">then inside the start function assign it’s value to be the module.</p>
<pre><code>start: function(){
Test = this;
}
</code></pre>
<p dir="auto">then to send the notification you would just use:</p>
<pre><code>Test.sendNotification(blah blah );
</code></pre>
]]></description><link>https://forum.magicmirror.builders/post/52636</link><guid isPermaLink="true">https://forum.magicmirror.builders/post/52636</guid><dc:creator><![CDATA[Seann]]></dc:creator><pubDate>Mon, 18 Feb 2019 11:33:49 GMT</pubDate></item></channel></rss>