Download as xlsx, pdf, or txt
Download as xlsx, pdf, or txt
You are on page 1of 7

S.

No
3
4
5
6
7
9
10
11
12
13
15
16
17
19
20
21
22
23
25
26
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
Questions
What is the significance of Edge Version of BackboneJS?
BackboneJS is a lightweight JS library that lets you build and structure the server side applications by separatin
Which one is not a building block of BackboneJS?
_ created BackboneJS and was initially released on
BackboneJS is based on __________________ architecture.
The BackboneJS separates ____________ and ______________.
What is the core part of any JavaScript application that retrieves and populates the data?
View holds HTML markup for the application.
What is used to send an HTTP request to the View?
The _________ binds and triggers the user's custom events to an application
What is view in Backbone.js?
In Backbone View, what is the use of setElement?
How can we get the Attribute value of a Model?
_ are the array of models that are created inside the collection.
How to extend an object called testObj from Backbone.Event?
How to override the model property of the collection class?
How to invoke the declared event in BackboneJS?
What is the only method available in the Backbone.js history?
BackboneJS can be included in project by
Which of the following is correct syntax for reading attributes from Model object?
View in BackbonJs can be considered as a kind of controller.
What is el Property of Backbone.js View?
_ is the first function called when the view is instantiated.
The Function escape gets the current value of an attribute from the model and returns the HTML-escaped vers
BackboneJS has a soft dependency with ____________ and a hard dependency with not
What is not an alternative to Backbone.js?
The _____________ method in view is used to encapsulate the logic required to render HTML
Which of the following is correct syntax for creating Backbone Collection with Model Model?
In which language, backbone JS is written?
Can we set default values for Model?
The ___________ method removes the callback functions or all events from an object.
What functionhave
If we already has to
anbe usedthat
object when you want
extends fromtoa trigger thetype
backbone eventlike
only once view,
model, beforecollection,
being removed?
then we do not hav
eventing mechanism with any object.
BackboneJS works based on __________________ pattern.
Backbone.View render() function can return this reference.
The __________________ contains a list of models in BackboneJs application.
Any event triggered on a ______________ will also trigger on the _________________ in the model.
Answers
All of the options
0
controller
Jeremy Ashkenas. October 13th, 2010.
MVC
business logic, user interface logic.
Model
0
Router
Event
All
Used when Backbone view has to be applied to a different
DOM element.
Using .get() method
Models
_.extend(testObj, Backbone.Events);
Backbone.Collection.model
Using trigger() function
start
All of the options
objBook.get('title')
1
All of the options
initialize
1
Underscore.js, jQuery.
Java
.render()
var Library=Backbone.Collection.extend({model:Book});
JavaScript
Yes we can by using defaults:{}
remove
once
0
MVC
1
collection
model, collection
-----------------------------
Try it Out - Bind Your View To Model
//Write your code here
var Product = Backbone.Model.extend({});
var product = new Product({ product_id: "XXX01", name: "XXXXX", description: "XXXXXXXX", price:
"100/-" });

var ProductView = Backbone.View.extend({


el: "#app",
initialize: function() {
this.model.on("change", this.render);
},
render: function() {
this.$el.html(this.model.get("product_id"));
return this;
}
})
---------------------------
Try it Out - Trigger a Click Event
//Create your View AppView here with click event using alertMe function
var AppView = Backbone.View.extend({
el: "#app",
alertMe: function() {

}
});
-------------------------
Try it Out - a Simple DOM Manipulation Program
// Create your view myView here
var myView = Backbone.View.extend({
el: "#myParagraph",
initialize: function() {
this.$el.html("Views are Awesome Component in BackboneJS");
}
});
------------------------
Try it Out - a Model for Employee
// JavaScript
var Employee = Backbone.Model.extend({
// add initiate method with specified alert message
//add default values to the Employee Model
defaults : {
employee_id:12345,
name:'John Doe',
year_of_joining:2014,
address:'ABC Street'
}
});
var employee = new Employee();
-----------------------

// JavaScript
var Employee = Backbone.Model.extend({
defaults : {

getExperience: function(inYear) {
if(inYear == 1999) {
this.set({'experience':19});
return 19;
} else {
return 8;
}
}
});
--------------------------
Try it Out - Events for Increment and Decrement
// JavaScript
var AppView = Backbone.View.extend ({
//Write your code here
initialize : function() {
$('#no_of_products').text(10);
},
addOne: function(){
var num = this.model.get('no_of_products');
console.log(num + " *******************");
num++;
console.log(num + " ++++++++++++++++++++");
this.model.set({"no_of_products": num});
$('#no_of_products').text(num);
},
minusOne: function(){
var num = this.model.get('no_of_products');
num--;
this.model.set({"no_of_products": num});
$('#no_of_products').text(num);
}
});
var appView = new AppView();
----------------------------
Try it Out - Todo List Application
//Define a global var task_id as 0
var task_id = -1;

//Define your Model, Task Model


var Task = Backbone.Model.extend({
defaults: {
taskid:0,
task_name:"",
task_desc:""
}
});

//Define your Collection, TasksCollection with Model as Task


var TasksCollection = Backbone.Collection.extend({
model: Task,
initialize: function () {
// This will be called when an item is added. pushed or unshifted
this.on('add', function(model) {
console.log('something got added');
});
// This will be called when an item is removed, popped or shifted
this.on('remove', function(model) {
console.log('something got removed');
});
// This will be called when an item is updated
this.on('change', function(model) {
console.log('something got changed');
});
}
});

//Define your View, TaskRecordsView with events buttons add(addTask),delete(deleteTask) and


clear(clearInput)
var TaskRecordsView = Backbone.View.extend({
e1:"#todoapp",
addTask : function() {
taskCollection.add(new Task());
if(task_id >= 2) {
task_id = 1;
}
task_id++;
return task_id;
},
deleteTask : function() {
task_id--;
},
clearInput : function() {
$('#task_name').text('');
$('#task_desc').text('');
$('#task_name').val('');
}

});

var taskCollection = new TasksCollection();


var tasksView = new TaskRecordsView({
collection:taskCollection
});

taskCollection.on('add', function () {
tasksView.render();
});
taskCollection.on('remove', function () {
tasksView.render();
});

You might also like