I am working on an application using meteorjs. I am totally new to meteor. In my application I am using dataTables with meteor for shorting , pagination and searching.
This is my template code
<template name="questions">
<div class="col-md-3">
{{#constant}}
<table class="table table-striped table-bordered table-condensed table-hover listing"
id="content_listing-table">
<thead>
<tr>
<th>Questions</th>
</tr>
</thead>
<tbody>
{{#each questions}}
<tr>
<td>
<a href="#" data-id={{_id}} class="edit"> {{questionSubString question_text}}</a>
</td>
</tr>
{{/each}}
</tbody>
</table>
{{/constant}}
</div>
</template>
and my meteor code is
Template.questions.rendered = function () {
$("#content_listing-table").dataTable();
}
Template.questions.questions = function () {
return Meteor.questions.find({topic_id: Session.get("currentTopicId")})
}
my problem is when i add a question to the database it doesn't seem on template. and generate an exception. I know this is because of datatables . and datatable is not update when document updated. i tried many examples from stackoverflow but couldn't get rid of this problem .I tried by appending row dynamically but it always give me a warning . and it doen't seems to do a right way. can i remove the datatables from the element dynamically? help will be appreciated EDIT:
$('#content_listing-table').dataTable().fnClearTable();
$('#content_listing-table').dataTable().fnAddData(Meteor.questions.find().fetch());
I am trying to do this first empty the table and then again add the data to it. But here it is emptying the table for not adding the data again.