The Knowledge Foundation : 005 BackboneJS Events once,listenTo,stopListening,listenToOnce

once : Similar to "on", but "once" fire only once before being removed.

            1)event − It binds an object.

            2)callback − It is the reference to the code.

            3)context − An java script object that can be passed to a callback function.

Example

<!DOCTYPE html>

<html>

<head>

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

type="text/javascript">

</script>

var obj = {};

_.extend(obj, Backbone.Events);

var Function1 = function ()

{

document.write("I am learing BackBoneJS");

};

var Function2 = function ()

{

document.write("I am learing Backbone Events");

};

obj.once("PassMsg", Function1);

obj.once("PassMsg", Function2);

document.write("-------------calling first time-----------");

obj.trigger("PassMsg");

document.write("-------------calling second time-----------");

obj.trigger("PassMsg");

</script>

</head>

</html>

Output :
-------------calling first time-----------
I am learing BackBoneJS
I am learing Backbone Events
-------------calling second time----------

listenTo : It tells an object to listen to particular event on an another object. listenTo to keep track of the events, and that can be removed later.

object.listenTo(other, event, callback)

            1)event − It binds an object.

            2)callback − It is the reference to the code.

            3)context − An java script object that can be passed to a callback function.

Example

<!DOCTYPE html>

<html>

<head>

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

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

var obj1 = {};

var obj2 = {};

_.extend(obj1, Backbone.Events);

_.extend(obj2, Backbone.Events);

var Function1 = function ()

{

document.write("I am learing BackBoneJS");

};

// The object 'obj2' listens once for the 'PassMsg' event triggered on object 'obj1'

obj2.listenTo(obj1, 'PassMsg', Function1)

obj1.trigger("PassMsg");

</script>

</head>

</html>

Output :

I am learing BackBoneJS

stopListening :Instruct an object to stop listening to events

object.

stopListening(other, event, callback)

1)other: Define the name of the other object.
2)event − It binds an object.
3)callback − It is the reference to the code.

Example

<!DOCTYPE html>

<html>

<head>

var obj1 = {};

var obj2 = {};

_.extend(obj1, Backbone.Events);

_.extend(obj2, Backbone.Events);

var Function1 = function ()

{

document.write("I am learing BackBoneJS");

};

document.write("---Before Firing Stop Listeing----------");

// The object 'obj2' listens once for the 'PassMsg' event triggered on object 'obj1'

obj2.listenTo(obj1, 'PassMsg', Function1)

obj1.trigger("PassMsg");

document.write("---After Firing Stop Listeing----------");

obj2.stopListening(obj1, "PassMsg");

obj1.trigger('PassMsg');

</script>

</head>

</html>

Output :
---Before Firing Stop Listeing----------
I am learing BackBoneJS
---After Firing Stop Listeing----------

listenToOnce :Same as listenTo event, but listento to occur only once before the callback function is being removed.

    object.listenToOnce(other, event, callback)

    other − It defines name of the other object.

    event − It binds an object.

    callback − It is reference to the code and called with object as context.

Example

<!DOCTYPE html>

<html>

<head>

var obj1 = {};

var obj2 = {};

_.extend(obj1, Backbone.Events);

_.extend(obj2, Backbone.Events);

var Function1 = function ()

{

document.write("I am learing BackBoneJS");

};

obj2.listenToOnce(obj1, 'PassMsg', Function1)

document.write("---First Time Call----------");

obj1.trigger("PassMsg");

document.write("---Second Time Call----------");

obj1.trigger("PassMsg");

</script>

</head>

</html>

Output :

---Before Firing Stop Listeing----------
I am learing BackBoneJS
---After Firing Stop Listeing----------

The Knowledge Foundation

Friday, 8 June 2018

005 BackboneJS Events once,listenTo,stopListening,listenToOnce

No comments:

Post a Comment

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

Labels

Report Abuse