CODEWITHSUNDEEP
viewbackbone.jsextend
liviu mamelluc
liviu mamelluc

Reputation: 45

How do I implement a common functionality across multiple views using backbone.js

Hello I'm trying to implement a custom functionality across multiple views using backbone.js. For example I need to have all the input textboxes in the application to change their visual appearance when they receive focus. I am thinking to inherit a window.BaseView from the Backbone.View.extend and then to have all my views to extend the BaseView. Could you please tell me if I'm on the right direction? Do you have other suggestion? Have you implemented something similar ?

Upvotes: 1

Views: 271

Answers (2)

Brian Genisio
Brian Genisio

Reputation: 48127

I would put the common functionality in a base prototype and have all the views extend it or I would create a mixin object that has the functionality and extend the view with the mixin.

Upvotes: 3

Esailija
Esailija

Reputation: 140210

I didn't use backbone for similar task since different views have different elements and binding same focus function more than once is also wasteful. What I would do is either:

//If document is the container for your application, else could be #myapplication and so on.
jQuery( document ).delegate( 'input[type="text"]', "focusin focusout",
    function(e){

        if( e.type == "focusin" ) {
        jQuery( this ).addClass("textbox-focused");
        }
        else {
        jQuery( this ).removeClass( "textbox-focused" );
        }

    }
);

or CSS (not sure about browser support):

input[type="text"]:focus {
background-color: blue;
}

Upvotes: 1

Related Questions