emberjs form creates a new record but the edit for

问题:

I have been bumping my head concerning editing a child record that is already created. I am using thesame form partial for both creating and editing. I am able to create a child record successfully with that form partial, but if I click edit, for some reason, the edit form does not display or contain the just created record, the edit form is basically empty.

To reproduce the error, don't add comments via the fixtureAdapter. If the record is in the comment fixtureAdapter you will see the record when you click edit. Infact even if you use fuxtures, you can only edit the 1st child record attached to a parent and not the 2nd or 3rd etc. To reproduce it let there be no fixtures for comment and then create a new record and then click the edit button and it will be empty. To create a new record, click on post -> then 'post title' -> at the bottom addComment- > then save and you will see that the record was created then now click edit and it will be empty.

This is the jsfiddle

The editComment and the CommentEditController

EmBlog.CommentEditController = Ember.ObjectController.extend({

   needs: ['comment', 'postsShow'],
   isEditing: false,

   editComment: function() { 

     var post = this.get('controllers.postsShow.content');
     console.log(post);

     var postId = post.get('id');
     console.log(postId);

     comment = EmBlog.Comment.find(postId);
     console.log(comment);

     transaction = comment.get('store').transaction();
     console.log(transaction);

     console.log(this.get('content')); 

     this.set('content', comment);

     transaction.add(this.get('content'));

     this.transaction = transaction;   

     this.set('isEditing', true);

  },

  save: function(){

   var comment = this.get('content');
   comment.one('didUpdate', this, function() {
      this.set('isEditing', false);
   });

  this.transaction.commit();
  this.transaction = null;
   console.log(this.get('content')); 
  }  

});

The handlebars partial template

<script type="text/x-handlebars" data-template-name="comment/_form">
 <form {{action save content on='submit'}}>
   {{view Ember.TextArea valueBinding="body" placeholder="body"}}
   <button type="submit"> save comment </button>  
 </form>
</script>

The template for editing an existing record

<script type='text/x-handlebars' data-template-name='comment/edit'>
  {{#if controller.isEditing}}
    {{partial 'comment/form'}}
   {{/if}} 
   <br/>
  <div>
    <button {{action editComment this}} {{bindAttr disabled="isEditing"}}>
      Edit Comment</button>
 </div>
</script>

You can see it is identical to the form for adding new record

<script type='text/x-handlebars' data-template-name='comment/new'>
  {{#if controller.isAddingNew}}
    {{partial 'comment/form'}}
 {{/if}} 
<br/>
<div>
  <button {{action addComment}} {{bindAttr disabled="isAddingNew"}}>
   Add Comment</button>
</div>