Lorenzo Wagner
Lorenzo Wagner

Reputation: 1

Svelte Electron y Metro UI Css

I have a table component of the MetroUI framework; inside a Svelte component in an Electron application and I try to get the selected item from a table, the component exposes data-on-check-click for it; trying to call the function associated with the event throws an error of

metro.js:6704 Uncaught ReferenceError: onCheckClick is not defined at HTMLInputElement.eval (eval at func (metro.js:6687), <anonymous>:3:1)
at Object.exec (metro.js:6700) at HTMLInputElement.<anonymous> (metro.js:26206) at HTMLTableElement.func_event_click_94 (metro.js:1770)

any help is welcome

<script>
function onCheckClick(){
        console.log("Click !!");
}
</script>
<p>Brands</p>
<input type="text" data-role="input" data-reveal-button="false">
<p>Select image</p>
<input type="file" data-role="file" data-button-title="...">
<button class="button">Save</button>
<br/>
<table class="table" data-role="table"
data-rows="5"
data-check="true"
data-rows-steps="5, 10"
data-show-activity="false"
data-source="./../public/data/brands.json"
data-on-check-click="onCheckClick()"
>
</table>

Upvotes: -1

Views: 347

Answers (1)

Selim Acar
Selim Acar

Reputation: 378

Please remove the braces from the function name, which you define for the data-on-check-click attribute:

data-on-check-click="onCheckClick()"

If you use braces after function name, the function is called immediately. The data-on-check-click attribute should look like this:

data-on-check-click="onCheckClick"

Then you can define your event handler function like this:

function onCheckClick(clickedCheckbox){
    console.log(clickedCheckbox);
}

The output would look like:

<input type="checkbox" ...>

Upvotes: 0

Related Questions