ChanderG/jsbin.doceq.html

## jsbin.doceq.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="[add your bin description]" />
<meta charset=utf-8 />
<title>JS Bin</title>
  <script src="http://code.jquery.com/jquery-2.0.2.js"></script>
  <script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
  <script src="http://builds.emberjs.com/tags/v1.5.0/ember.js"></script>
  <script src="http://builds.emberjs.com/beta/ember-data.js"></script>
</head>

<body>

  <script type="text/x-handlebars" data-template-name="application">
    <h1>Ember Data there?</h1>
    This is an example of one - one saving data</br>
    See comments and output</br></br>
    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="index">
    HERE IS A LIST of Planets:
    <button {{action add}}>Add</button>
    <ul>
      {{#each}}
      <li>{{id}} {{name}}</li>
         {{moon.name}}
        {{input type="text" value=controller.box}}
       <button {{action update moon.id }}>Update</button>
      {{/each}}
  </ul>

  <button {{action showOrders}}>Show</button>
  HERE IS A LIST of moons:
  <ul>
     {{#each moon in controller.moons}}
     <li>{{moon.id}}{{moon.name}}</li>
        {{moon.planet.name}}
     {{/each}}
  </ul>


  </script>


</body>
</html>


## jsbin.doceq.js
//One-one creation and updating records FA

App = Ember.Application.create({LOG_TRANSITIONS: true});

App.ApplicationAdapter = DS.FixtureAdapter.extend({});

App.Router.map(function() {

});

App.Planet = DS.Model.extend({
   name: DS.attr('string'),
   moon: DS.belongsTo("moon" , {async: true})  //needs async true to load required data on its own
});

App.Planet.FIXTURES = [
  {
    id: 1,
    name: "Earth",
    moon: 1
  },
  {
    id: 2,
    name: "Jupiter",
    moon: 2
  }
];

App.Moon = DS.Model.extend({
    name: DS.attr('string'),
    planet: DS.belongsTo('planet')
});

App.Moon.FIXTURES = [
  {
    id: 1,
    name: "Moon",
    planet: 1
  },
  {
    id: 2,
    name: "Ganymade",
    planet: 2
  }
];

App.IndexRoute = Ember.Route.extend({
  model: function(){
    return this.store.find('planet');
  }

});

App.IndexController = Ember.ArrayController.extend({
  moons: null,
  box: null,
  actions: {
    showOrders: function(){
        console.log('hello there');
       this.set('moons', this.get('store').find('moon'));
    },
    update: function(id){
      var store = this.get('store');
      var nname = this.get('box');

      // --updating direct properties: name WORKING
      //var updateEvent = {id: id, name: nname};

      // --updating single properties of child: NOT-WORKING
      //var updateEvent = {id: id, moon: {name: nname}};

      //--updating single properties of child: NOT-WORKING
      //var existing = store.find('planet', id);
      //var updateEvent = {id: id, moon: {id: existing.moon, name: nname}};

      //--updating single properties directly: WORKING
      var updateEvent = {id: id, name: nname};
      store.update('moon', updateEvent);

      //store.update('planet', updateEvent);
      this.set('box',"");
    },

    add: function(){
       var store = this.get('store');


       //trying to create a parent with children - not working
      /*
      store.createRecord('planet', {
         id : 42,
         name: "Mars",
         moon: {id: 68, name: "Phobos"}
       });
       */


       //NOT-WORKING
      //Error: Assertion Failed: You can only add a 'moon' record to this relationship
       /*
       store.createRecord('planet', {
         id : 42,
         name: "Mars",
         moon: 1
       });
       */

        /*
        //trying to create a parent , children - not working
        store.createRecord('moon', {
         id : 68,
         name: "Phobos"//,
         //planet: 42
       });
         */

       store.createRecord('planet', {
         id : 42,
         name: "Mars",
         moon: 1
       });

    }
  }
});
	<!DOCTYPE html>
	<html>
	<head>
	<meta name="description" content="[add your bin description]" />
	<meta charset=utf-8 />
	<title>JS Bin</title>
	<script src="http://code.jquery.com/jquery-2.0.2.js"></script>
	<script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
	<script src="http://builds.emberjs.com/tags/v1.5.0/ember.js"></script>
	<script src="http://builds.emberjs.com/beta/ember-data.js"></script>
	</head>

	<body>

	<script type="text/x-handlebars" data-template-name="application">
	<h1>Ember Data there?</h1>
	This is an example of one - one saving data</br>
	See comments and output</br></br>
	{{outlet}}
	</script>

	<script type="text/x-handlebars" data-template-name="index">
	HERE IS A LIST of Planets:
	<button {{action add}}>Add</button>
	<ul>
	{{#each}}
	<li>{{id}} {{name}}</li>
	{{moon.name}}
	{{input type="text" value=controller.box}}
	<button {{action update moon.id }}>Update</button>
	{{/each}}
	</ul>

	<button {{action showOrders}}>Show</button>
	HERE IS A LIST of moons:
	<ul>
	{{#each moon in controller.moons}}
	<li>{{moon.id}}{{moon.name}}</li>
	{{moon.planet.name}}
	{{/each}}
	</ul>


	</script>


	</body>
	</html>
	//One-one creation and updating records FA

	App = Ember.Application.create({LOG_TRANSITIONS: true});

	App.ApplicationAdapter = DS.FixtureAdapter.extend({});

	App.Router.map(function() {

	});

	App.Planet = DS.Model.extend({
	name: DS.attr('string'),
	moon: DS.belongsTo("moon" , {async: true}) //needs async true to load required data on its own
	});

	App.Planet.FIXTURES = [
	{
	id: 1,
	name: "Earth",
	moon: 1
	},
	{
	id: 2,
	name: "Jupiter",
	moon: 2
	}
	];

	App.Moon = DS.Model.extend({
	name: DS.attr('string'),
	planet: DS.belongsTo('planet')
	});

	App.Moon.FIXTURES = [
	{
	id: 1,
	name: "Moon",
	planet: 1
	},
	{
	id: 2,
	name: "Ganymade",
	planet: 2
	}
	];

	App.IndexRoute = Ember.Route.extend({
	model: function(){
	return this.store.find('planet');
	}

	});

	App.IndexController = Ember.ArrayController.extend({
	moons: null,
	box: null,
	actions: {
	showOrders: function(){
	console.log('hello there');
	this.set('moons', this.get('store').find('moon'));
	},
	update: function(id){
	var store = this.get('store');
	var nname = this.get('box');

	// --updating direct properties: name WORKING
	//var updateEvent = {id: id, name: nname};

	// --updating single properties of child: NOT-WORKING
	//var updateEvent = {id: id, moon: {name: nname}};

	//--updating single properties of child: NOT-WORKING
	//var existing = store.find('planet', id);
	//var updateEvent = {id: id, moon: {id: existing.moon, name: nname}};

	//--updating single properties directly: WORKING
	var updateEvent = {id: id, name: nname};
	store.update('moon', updateEvent);

	//store.update('planet', updateEvent);
	this.set('box',"");
	},

	add: function(){
	var store = this.get('store');


	//trying to create a parent with children - not working
	/*
	store.createRecord('planet', {
	id : 42,
	name: "Mars",
	moon: {id: 68, name: "Phobos"}
	});
	*/


	//NOT-WORKING
	//Error: Assertion Failed: You can only add a 'moon' record to this relationship
	/*
	store.createRecord('planet', {
	id : 42,
	name: "Mars",
	moon: 1
	});
	*/

	/*
	//trying to create a parent , children - not working
	store.createRecord('moon', {
	id : 68,
	name: "Phobos"//,
	//planet: 42
	});
	*/

	store.createRecord('planet', {
	id : 42,
	name: "Mars",
	moon: 1
	});

	}
	}
	});