0
votes

I am trying to create a simple blog app with emberjs. The feature for creating a title and body for the post works fine as seen in this jsfiddle.

Now I want to add the next feature which is comments, which should be displayed when you click on an individual post. on the home page, click post then clicking the title of an individual, should show a comment box to add comments.

I get the following error when I click the save button

On my local develop environment using ember-data and the rest adapter, I get the error:

uncaught TypeError: Cannot call method 'commit' of undefined

In JSfiddle using the fixture adapter with thesame code, the error becomes

TypeError: this.transaction is undefined this.transaction.commit();

posts/show.handlebars

    <script type="text/x-handlebars" data-template-name="posts/show">
      <h1>Post</h1>
      <p>Your content here.</p>
       <h3> {{title}} </h3>
       <h3> {{body}} </h3>
     </br>
    <p> {{#linkTo 'posts.index'}} back {{/linkTo}}</p>
    <p> {{#linkTo 'posts.edit' content}} Edit the post  {{/linkTo}}</p> 
    <br/>
     <p> Add Comments</p>
      {{render 'comment/new' comments}}
   </script>

comment/new.handlebars

 <form {{action save on='submit'}}>
   {{view Ember.TextArea valueBinding='body' placeholder='body'}}
   <button type="submit"> Add comment </button>
 </form>

  EmBlog.CommentNewController = Em.ObjectController.extend({
     needs: ['posts'],
     addComment: function(){
       post = this.get('controllers.postsShow').get('model');
       comment = post.get('comments')
       this.transaction = comment.get('store').transaction.createRecord({body: body});
     },

     save: function(){
       this.transaction.commit();
     }  
   });

 EmBlog.Comment = DS.Model.extend({
   body: DS.attr('string'),
   post_id: DS.attr('integer')'
   post:  DS.belongsTo('EmBlog.Post')
 });

Any suggestions on how to fix this in way that every time I create a comment it will include the post_id.

 **Update**

This is the latest gist, it doesn't display any error when I save comment but the comments don't appear on the page. It seems they are silently ignored.

1

1 Answers

2
votes

DS.Store#transaction is a function, not a property. It returns a DS.Transaction... however, you are calling createRecord on it immediately, so you're actually storing the result of that call (a record) in your transaction property. Additionally, createRecord on a DS.Transaction requires a type as the first parameter.

Because this is an ObjectController we have to define our internal properties in our class definition, otherwise they'll get passed through to the content.

EmBlog.CommentNewController = Em.ObjectController.extend({
    transaction: null,

And then in your actual code:

var transaction = post.get('store').transaction();
if (transaction) {
    this.set('transaction', transaction);
    transaction.createRecord(EmBlog.Comment, {body: body});
} else { console.log('store.transaction() returned null'); }

then later:

this.get('transaction').commit();

Note that the comment won't be automatically scoped to the Post, so make sure to set your relationships.