CanJS jQuery Template

Includes jQuery, CanJS and all of its plugins. Use it as a starting point when you want to demo something.

HTML

<script src="http://canjs.us/release/latest/can.jquery.js"></script>
<script src="http://canjs.us/release/latest/can.construct.proxy.js"></script>
<script src="http://canjs.us/release/latest/can.control.plugin.js"></script>
<script src="http://canjs.us/release/latest/can.observe.attributes.js"></script>
<script src="http://canjs.us/release/latest/can.observe.backup.js"></script>
<script src="http://canjs.us/release/latest/can.observe.delegate.js"></script>
<script src="http://canjs.us/release/latest/can.observe.setter.js"></script>
<script src="http://canjs.us/release/latest/can.observe.validations.js"></script>
<script src="http://canjs.us/release/latest/can.view.modifiers.js"></script>
<script src="http://canjs.us/release/latest/can.fixture.js"></script>
<div id="parent">
</div>
<div id="child">
</div>
<div id="subchild">
</div>

CSS

#parent{
    width: 100px;
    height: 100px;
    background-color: red;
}

 #child{
    width: 100px;
    height: 100px;
    background-color: blue;
} 

 #subchild{
    width: 100px;
    height: 100px;
    background-color: green;
}

JavaScript

var Parent = can.Control({
    param:'parent',
    showName: function(){ alert(this.param) },
    'click': function(){ this.showName() }
})
        
var Child = Parent({
    param:'child',
})
        
var SubChild = Parent({
    param:'subchild',
})

        
var parent = new Parent('#parent');
var child = new Child('#child');
var subchild = new SubChild('#subchild');