I have some text that is being generated from a script that I am calling thru httpClient.fetch.
It returns some html code that I then insert into the innerHTML attribute in the viewModel like so:
<p innerHTML.bind="note.htmlComments"></p>
This is the code generating the text:
my $txt = "<a name=\"$item_no\">
</a>
<div id=\"short_$item_no\"$short_style>$short_text<br>\n
<span class=\"span spanLink\" onclick=\"expand_div($item_no)\">+ Expand $label</span>
</div>
<div id=\"long_$item_no\" $long_style>$shrink_text<br>\n$long_text<br>\n$shrink_text</div>";
This is the html code from the inspect element:
<span class="span spanLink" onclick="expand_div(c64293822)">+ Expand this note</span>
It is displaying properly in the html when I load the page, and I can tell that itās loaded properly because I have classes āspan and spanLinkā and they are doing what they should.
My problem is when I try to click on Expand this note
, the function expand_div
is not found.
I have tried the following:
In the activate
function, I have tried this:
let scriptElement = document.createElement('script');
scriptElement.src = '/expand_collapse.js'; (have also tried './expand_collapse.js')
this.scriptElementInHead = document.querySelector('head').appendChild(scriptElement);
This produces a GET
error because it cannot find the file.
Also this:
<script type="text/javascript" src="./expand_collapse.js"></script>
This produces no errors, but the function is never found.
Also, I have tried including the function directly into my customer.js file as follows:
expand_div(id)
{
var form = document.forms['notes_form'];
var short = 'short_' + id;
var long = 'long_' + id;
console.log('expand_div', d.short);
}
Contents of expand_collapse.js:
export function expand_div(id)
{
var form = document.forms['notes_form'];
var short = 'short_' + id;
var long = 'long_' + id;
console.log('expand_div', d.short);
}
I need to figure out how to make this work, because the script is generating long and short versions of the notes that I want to dynamically display based on a click from the user.