Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  
  
  <div ng-app="myApp">
    <div ng-controller="myCtrl">
        <div class='filter_block'>
            <div ng-repeat="opt in options track by $index">
                <label for='{{opt.id}}'>{{'Checkbox' + ($index + 1)}}                   </label>
                <input type='checkbox' value={{$index}} id='{{opt.id}}' ng-blur="showFilter = false" ng-change="showFilter = true" ng-model="_model_"/>
                <div ng-show="showFilter" class='floating'>         <button>Filter</button></div>
            </div>
            <div>
                <input type='text' value=''/>
            </div>
        </div>
    </div>
</div>
  </body>
</html>
 
var angularApp = angular.module('myApp', []);
angularApp.controller('myCtrl', ['$scope', function ($scope) {
    $scope.options = [{
       'id' : 'cb1'
    }, {'id' : 'cb2'}];
}]);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers