How to set Default Value in Ember js - ember.js

Question

Using Below code i have created Ember View.
<script type="text/x-handlebars">
<h2>Welcome to Ember.js</h2>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="index">
<div>
{{view "select" content=model prompt="Please select a name" selectionBinding="controllers.comboBox.model" optionValuePath="content.title" optionLabelPath="content.body" }}
</div>
<div>
{{view "select" content=model1 prompt="Please select a name" optionValuePath="content.title" optionLabelPath="content.title" }}
</div>
</script>
and App.Js
App = Ember.Application.create({
});
App.Router.map(function () {
});
App.IndexRoute = Ember.Route.extend({
model: function () {
return posts;
}
});
App.IndexController = Em.ArrayController.extend({
needs: ["comboBox"],
sendValueToServer: function () {
document.getElementById("comboval").value = this.get("controllers.comboBox.model.title");
}.observes("controllers.comboBox.model"),
model1: function () {
var valueq = this.get('controllers.comboBox.model.title');
console.log("value "+valueq);
return posts1;
}.property("controllers.comboBox.model")
});
App.ComboBoxController = Em.Controller.extend({
model: null,
});
App.ComboBox1Controller = Em.Controller.extend({
model1: null,
});
posts = [{
title: "Raja",
body: "There are lots of à la carte software environments in this world."
}, {
title: "Broken Promises",
body: "James Coglan wrote a lengthy article about Promises in node.js."
},
{
title: "Broken",
body: "James Coglan wrote a lengthy article about Promises in node.js."
}
];
posts1 = [{
title: "Raja",
body: "There are lots of à la carte software environments in this world."
}, {
title: "Broken Promises",
body: "James Coglan wrote a lengthy article about Promises in node.js."
},
{
title: "Broken",
body: "James Coglan wrote a lengthy article about Promises in node.js."
}
];
Above code using Prompt I was showing "Please select a name" Default Value.
but Initially i dont want Please select a name default value.
my requirement is need to show second value as a default value.
how can i do this.

Answer 1

In association to the question mentioned here,
Second dropdown not calling EveryTime Based on First drop down
To set a default value all it is required is to set a value to the bound property of the specific drop down.
http://emberjs.jsbin.com/loqivasova/1/edit
js
App.ComboBoxController = Em.Controller.extend({
model: posts[0],
});
if however it is required to also modify the second drop down based on this default value, then just add on("init") to the setComboBox1Model1 function,
js
setComboBox1Model1:function(){
var valueq = this.get('controllers.comboBox.model.title');
var valueFromPosts1 = posts1.findBy("title",valueq);
this.set("controllers.comboBox1.model1",valueFromPosts1?valueFromPosts1:null);
}.observes("controllers.comboBox.model").on("init")
http://emberjs.jsbin.com/jogaqinugi/1/edit?html,js,output
If it is required to set the value after the view has rendered, then you should use a view
js
App.IndexView = Em.View.extend({
setDefaulValue:function(){
this.set("controller.controllers.comboBox.model",posts[0]);
}.on("didInsertElement")
});
http://emberjs.jsbin.com/qugefipefi/1/edit?html,js,output