datatables are not updating in meteorjs

2019-08-30 10:58发布

问题:

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.

回答1:

You are using a {{constant}} region. This disables reactivity for that part of the template.

Try getting rid of your constant region and run meteor using meteor --release template-engine-preview-5.5. This will run meteor using the new, in progress template engine Meteor UI. There are no constants or preserves in Meteor UI - it's smart enough to make DOM changes at a fine-grained level, so it should work out of the box with things like jQuery plugins.