i have external file for templates i want to adding the templates in it but when i adding the onclick functoin its show error massage the handleClickCard not defind
import { handleClickCard } from "../../../script.mjs";
function templateCard(item, condition, idUpdate, id, title, tags) {
const card = `
<div class="card" >
<div class="card-header">
<span onclick="showuserinfo('${encodeURIComponent(JSON.stringify(item),
)}')" style="cursor: pointer;"><strong>${item.author.username
}</strong>
</span>
${condition
? `<button class="btn btn-danger mx-2" style="float: right;" onclick={handleclickdeletebutton('${idUpdate}')}>delete</button>`
: ""
}
${condition ? `<button class="btn btn-primary" style="float: right;" onclick="handleclickeditbutton('${encodeURIComponent(JSON.stringify(item),)}')">edit</button>`
: ""}
</div>
<!-- the problem in here and there is another problem in the file but its the same solution for this problem -->
<div class="card-body" onclick="handleClickCard(${id})">
</div>
</div>
</div>
`;
return card;
}
export { templateCard };
and handleClickCard in another file i export it
export const handleClickCard = () => {
console.log("handle click")
}
and the error massage that show :
Uncaught ReferenceError: handleClickCard is not defined
so how to perform the function from the external templates file ????