JSFiddle - React, Tailwind, and code Playground

by cherif_b

HTML

<script src="http://dev.schuelerpilot.de/javascript/can.2.0.6.min.js"></script>
<script id="template" type="text/mustache">
    {{#offers}}
        <div class="offer">{{.}}</div>
    {{/offers}}
    
</script>

<div id="wrapper">
    
</div>

CSS

.offer {
    width: 100px;
    height: 100px;
    background-color: #ccc;
    margin: 5px;
}

JavaScript

var offers = new can.List();
var data = new can.Map();

data.attr('offers', offers);

offers.push('1');
offers.push('2');
offers.push('3');
offers.push('4');
offers.push('5');



var template = can.view("#template", data)
$('#wrapper').html(template);


can.Control.extend('mynamespace.fooController',{
  init: function( element , options ) {
      
  },
  'click ': function(){
      alert("ha");
  }
                        
});
    
var foo = new mynamespace.fooController('.offer');


/** Ajax async call --> adding into can.List **/
offers.push('6');
offers.push('7');
offers.push('8');


/** NO EVENT BINDING **/
foo.on(); // NOT WORKING