The Knowledge Foundation

Tuesday, 12 June 2018

012 BackboneJS Model urlRoot,parse,clone,isNew,hasChanged,changedAttributes,previous,previousAttributes

urlRoot : You can use model outside of a collection , then return the url to where the model's resource is located.

Syntax : model.urlRoot or model.urlRoot()

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = Backbone.Model.extend({

urlRoot: '/tutorialspoint/backbonejs'

});

var stuObj = new student();

document.write(stuObj.url());

</script>

</head>

</html>

Output :

/tutorialspoint/backbonejs

parse : Method returns the model data by passing through the response object and represents the data in JSON format.

Syntax : model.parse(response, options)

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var myData = {

"values": [{

"name": "john",

"age": "12"

}]

};

var student = Backbone.Model.extend({

parse: function (response, options) {

document.write(JSON.stringify(response));

}

});

var stuObj = new student(myData, { parse: true });

</script>

</head>

</html>

Output :

{"values":[{"name":"john","age":"12"}]}

clone :Returns a new instance of the model just coping one model object to another object.

Syntax : model.clone()

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = Backbone.Model.extend();

var stuObj = new student({name:'John',age:12});

var stuObj2 = stuObj.clone();

document.write(JSON.stringify(stuObj2));

</script>

</head>

</html>

Output :

{"name":"John","age":12}

isNew : Detect model been saved to the server of not.

Syntax : model.isNew()

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = Backbone.Model.extend();

var stuObj = new student();

var stuObj1 = new student({ name: 'john', age: 15 });

document.write(stuObj.isNew());

document.write("");

document.write(stuObj1.isNew());

</script>

</head>

</html>

Output :

true
true

hasChanged : The model has changed since its last set.If that specific attribute has changed.

Syntax :model.hasChanged([attribute])

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = Backbone.Model.extend();

var stuObj = new student({ name: 'john', age: 15 });

document.write(stuObj.hasChanged());

stuObj.set({ 'name': 'john 2' });

document.write("");

document.write(stuObj.hasChanged());

</script>

</head>

</html>

Output :

false
true

changedAttributes : changedAttributes method returns the hash of model' s attributes that have been changed since the last set.It return false , if there is no attributes.

Syntax : model.changedAttributes([attributes])

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = new Backbone.Model({

name1: 'john',

age: 12,

});

student.on('change', function () {

document.write(JSON.stringify(student.changedAttributes()));

});

student.set({

name1: 'john2',

age: 15

});

</script>

</head>

</html>

Output :

{"name1":"john2","age":15}

previous : It retrive the previous value of the attribute.

Syntax : model.previous(attribute).
Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = new Backbone.Model({

age: 12

});

document.write("Name is :" + student.get('name'));

document.write('');

student.set({

age: 15

});

document.write("After change , Name is :" + student.get('name'));

document.write('');

document.write("Here is previous value is :" + student.previous("name"));

</script>

</head>

</html>

Output :

Name is :john
After change , Name is :john2
Here is previous value is :john

previousAttributes :The Backbone.js PreviousAttributes gives the model's previous attributes before the last change event.

Syntax : model.previousAttributes()

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = new Backbone.Model({

age: 12

});

document.write("Name is :" + student.get('name'));

document.write('');

student.set({

age: 15

});

document.write('');

document.write(JSON.stringify(student.previousAttributes()));

</script>

</head>

</html>

Output :

Name is :john

{"name":"john","age":12}

Monday, 11 June 2018

011 BackboneJS Model destroy,validate,isValid,url

destroy :Destroys the model on the server by using the
Backbone.sync.

Syntax :model.destroy()

Example

<!DOCTYPE html>

<html>

<head>

Backbone.sync = function (method, model)

{

document.write(method + ": " + JSON.stringify(model) + '');

model.set('id', 1);

};

var student = new Backbone.Model

({

});

student.save();

student.destroy();

</script>

</head>

</html>

Output :

create: {"name":"john","class":4}
delete: {"name":"john","class":4,"id":1}

validate :This method is undefined and you can write your custom validation logic with the help of JavaScript

Syntax : model.validate(attributes, options)

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = Backbone.Model.extend({

defaults: {

age: 2

validate: function (attrs)

{

if (attrs.name)

{

if (attrs.name.length < 5)

{

document.write('Please enter your full name.');

}

if (attrs.age)

{

if (attrs.age < 18)

{

document.write('You are less than 18.');

}

});

var stuObj = new student();

stuObj.set({ age: '2' }, { validate: true });

</script>

</head>

</html>

Output :

Please enter your full name.
You are less than 18.

isValid :Validation check for model state.

Syntax : model.isValid()

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = Backbone.Model.extend({

defaults: {

age: 2

validate: function (attrs)

{

if (attrs.name)

{

if (attrs.name.length < 5)

{

document.write('Please enter your full name.');

}

if (attrs.age)

{

if (attrs.age < 18)

{

document.write('You are less than 18.');

}

});

var stuObj = new student();

stuObj.set({ name:'John2',age: '19'}, { validate: true });

if (stuObj.isValid())

{

document.write('You model is valid.');

}

</script>

</head>

</html>

Output :

You model is valid.

url : Returns the relative URL where the model's resource is located.

Syntax :model.url()

Example

<!DOCTYPE html>

<html>

<head>

type="text/javascript"></script>

type="text/javascript"></script>

var student = Backbone.Model.extend({

urlRoot: '/tutorialspoint/backbonejs'

});

var stuObj = new student();

document.write(stuObj.url());

</script>

</head>

</html>

Output :
/tutorialspoint/backbonejs

The Knowledge Foundation

Tuesday, 12 June 2018

012 BackboneJS Model urlRoot,parse,clone,isNew,hasChanged,changedAttributes,previous,previousAttributes

Monday, 11 June 2018

011 BackboneJS Model destroy,validate,isValid,url

বাঙালির বেড়ানো সেরা চারটি ঠিকানা

Labels

Report Abuse