I am populating a datatable (using aldeed:tabular package) using a selector with an array of company names. I have a form input for users to submit a company name, which should populate the array on click. The company names are fields in a collection Companies - the form does not update the collection, I’m only capturing the value for purposes of creating the selector. The datatable does recognize the “compset” array since the datatable is correctly populated with the {name: “Example”} document.
I am having a lot of difficulty writing the event handler. I’ve gone through several iterations here - in the latest, below, nothing happens on click, not even an error message. I’m pretty confident the event handler is written properly, so I am wondering if I am missing something related to how I am using template helpers.
I will also need to address reactivity and multiple instances of the template but for now I’m really just trying to get the push to work. Any guidance on those would be much appreciated though. Thanks so much in advance.
client/company_comps.html
<template name="CompanyComps">
<div>
<div>
<h3>Comps</h3>
</div>
<div>
<form class="addComps">
<input type="text" name="comp" id="comp" placeholder="Type company name" />
<button type="submit" class="addComp">Add Company</button>
</form>
<br><br>
</div>
<div>
{{> tabular table=TabularTables.Comps selector=comps class="table table-striped table-bordered table-condensed"}}
</div>
</div>
client/company_comps.js
//Define array "compset"
compset = ["Example"];
Template.CompanyComps.events ({
//Click button with class "addComp"
'click .addComp': function (event) {
//Prevent default
event.preventDefault();
//Push value of input with name "comp" to array "compset"
compset.push(document.getElementById("comp").value);
}
});
Template.CompanyComps.helpers({
comps: function () {
//Define selector for datatable - select documents whose "name" is in "compset" array
return {name: {$in: compset}};
}
});
If I run console.log(compset); in the console after hitting click, I see the following:
["Example"] VM5624:2
undefined
Brendan