Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
​
<head>
    <script src="https://handsontable.github.io/ngHandsontable/node_modules/angular/angular.js"></script>
    <script src="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.js"></script>
    <link type="text/css" rel="stylesheet" href="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.min.css">
    <script src="https://handsontable.github.io/ngHandsontable/dist/ngHandsontable.js"></script>
</head>
​
<body ng-app="app">
    <div ng-controller="Ctrl">
        <hot-table settings="settings" on-after-create-row="onAfterCreateRow" datarows="dataJson"></hot-table>
        <br><br>
        <textarea cols=40 rows=20 ng-model="dataString"></textarea>
    </div>
    <script>
    var app = angular.module('app', ['ngHandsontable']);
    app.controller('Ctrl', ['$scope', '$filter', 'hotRegisterer','$timeout', function ($scope, $filter, hotRegisterer, $timeout) {
        $scope.dataJson = [[5, 6], [7, 8]];
​
        $scope.onAfterCreateRow = function (index, amount) {
           $timeout(function(){});
        };
​
        $scope.$watch('dataJson', function (dataJson_new) {
            console.log("watch dataJson");
            $scope.dataString = $filter('json')(dataJson_new);
        }, true);
​
        $scope.$watch('dataString', function (dataString_new) {
            console.log("watch dataString");
            try {
                $scope.dataJson = JSON.parse(dataString_new);
            } catch (e) {
                console.log("not wellFormed");
            }
        }, true);
​
        $scope.settings = {
            contextMenu: true,
            contextMenuCopyPaste: {
                swfPath: 'zeroclipboard/dist/ZeroClipboard.swf'
            }
        };
    }]);
</script>
</body>
​
</html>
 
​
Output 300px

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

Dismiss x
public
Bin info
anonymouspro
0viewers