In this article, we will see the Backbone.js hasChanged() model. The hasChanged() model checks if the model is changed or not, i.e. it will return a boolean value as true if the value is changed, otherwise returns a false value, since its last set, in order to set that value for an attribute in the model.
Syntax:
Backbone.Model.hasChanged(attribute);
Parameter Value:
- attribute: This parameter specifies the property of the model.
Example 1: In this example, we will update the value of a model and check using the hasChanged() model.
HTML
<!DOCTYPE html> <html> Â Â <head> Â Â Â Â Â Â Â Â Â Â Â Â type="text/javascript"> Â Â Â Â Â Â </script> Â Â Â Â <script src= Â Â Â Â Â Â Â Â Â Â Â Â type="text/javascript"> Â Â Â Â Â Â </script> Â Â Â Â <script src= Â Â Â Â Â Â Â Â Â Â Â Â type="text/javascript"> Â Â Â Â Â Â </script>Â Â Â Â </head> Â Â <body> Â Â Â Â <script type="text/javascript"> Â Â Â Â Â Â var Books = Backbone.Model.extend(); Â Â Â Â Â Â var book = new Books({ Â Â Â Â Â Â Â Â Â Â book_name: "css" Â Â Â Â Â Â }); Â Â Â Â Â Â document.write('Actual Values: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + JSON.stringify(book)); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write('Actual Value Changed ?: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + book.hasChanged()); Â Â Â Â Â Â book.set('book_name', 'php'); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write('Changed Values: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + JSON.stringify(book)); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write('Actual Value Changed ?: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + book.hasChanged()); Â Â Â Â </script> </body> </html> |
Output:
Actual Values: {"book_name":"css"}
Actual Value Changed ?: false
Changed Values: {"book_name":"php"}
Actual Value Changed ?: true
Example 2: In this example, we will update the value of an empty model and check using the hasChanged() model.
HTML
<!DOCTYPE html> <html> Â Â <head> Â Â Â Â Â Â Â Â Â Â Â Â type="text/javascript"> Â Â Â Â Â Â </script> Â Â Â Â <script src= Â Â Â Â Â Â Â Â Â Â Â Â type="text/javascript"> Â Â Â Â Â Â </script> Â Â Â Â <script src= Â Â Â Â Â Â Â Â Â Â Â Â type="text/javascript"> Â Â Â Â </script> </head> Â Â <body> Â Â Â Â <script type="text/javascript"> Â Â Â Â Â Â var Books = Backbone.Model.extend(); Â Â Â Â Â Â var book = new Books({}); Â Â Â Â Â Â document.write('Actual Values: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + JSON.stringify(book)); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write('Actual Value Changed ?: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + book.hasChanged()); Â Â Â Â Â Â book.set('book_name', 'php'); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write('Changed Values: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + JSON.stringify(book)); Â Â Â Â Â Â document.write("<br>"); Â Â Â Â Â Â document.write('Actual Value Changed ?: 'Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â + book.hasChanged()); Â Â Â Â </script> </body> </html> |
Output:
Actual Values: {}
Actual Value Changed ?: false
Changed Values: {"book_name":"php"}
Actual Value Changed ?: true
Reference: https://backbonejs.org/#Model-hasChanged
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
