Ember data model created with createRecord with no params does not appear

2
votes

We have an example ember app where we CRUD recipes. For the route where we create a new Recipe, if we pass attributes into createRecord like so:

Cookbook.RecipesNewRoute = Ember.Route.extend
  model: ->
    Cookbook.Recipe.createRecord(title: "blank")

the recipe appears immediately in the list on the left side of the screen. Here's the jsbin to show what I mean

However, if I create the recipe without args a la

Cookbook.Recipe.createRecord()

I don't see the recipe appear in the list until I edit one of the attributes. This happens even though I've specified default values, as proved by this jsbin.

My question is: Why does this happen and how can I create a record with no params specified and still have it show up immediately?

3
ember.jsember-data

3 Answers

0
votes

Looking at your jsbin's the only thing you are missing is @get('store').commit() after you create the empty record.

Here an example:

Cookbook.RecipesNewRoute = Ember.Route.extend
  model: ->
   Cookbook.Recipe.createRecord()
   @get('store').commit()

and here your working jsbin. I've added id's in parenthesis to the template so you can see the record is created correctly.

EDIT After your comment I've made some changes to the jsbin, basically what I've changed is this:

Cookbook.RecipesNewRoute = Ember.Route.extend
  setupController: (controller) ->
    controller.startEditing()

Cookbook.RecipesNewController = Ember.ObjectController.extend
  startEditing: ->
    @controllerFor('recipes').pushObject(Cookbook.Recipe.createRecord())

I've added the method startEditing for convenience (you can call it what ever you want). In the startEditing method as you can see we get the recipesController and add a new record to the content array, this causes the new recipe to show up even if not commited to the store. Give it a try.

Hope it helps

0
votes

So it seems pretty hacky, but here's how I got this working the way I wanted it to:

 Cookbook.RecipesNewRoute = Ember.Route.extend
   model: ->
     recipe = Cookbook.Recipe.createRecord()
     @controllerFor('recipes').get("content").addReference(recipe.get("_reference"))
     recipe

I don't know if this is kosher, at all, but it seems to work. Feedback and improvements are welcome. I won't mark this as answered for a few days to give anyone else a chance to come up with something better.

0
votes

look into the HTML and you will see that the <li> element has been created, but the title property of this model is empty, so the new recipe doesn't show up in the list.

<li>
    <a id="ember413" class="ember-view" href="#/recipes/ember369">
         <script id="metamorph-12-start" type="text/x-placeholder"></script>
         <script id="metamorph-12-end" type="text/x-placeholder"></script>
    </a>
</li>