JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.js"></script>
<div ng-controller="Ctrl">
<input ng-model="alphabet" ng-change="confirmChange(alphabet)"
ng-init=18
></input>
</div>
JavaScript
var app = angular.module('myApp', []);
var confirmDialog = function(newVal, yes, no) {
// obviously not a good way to ask for the user to confirm
// replace this with a non blocking dialog
//the timeout is only for the confirm since it's blocking the angular $digest
setTimeout(function() {
// c = confirm('Is it ok? [' + newVal + ']');
// if(c) {
// yes();
// }
// else {
no();
//}
}, 0);
}
function Ctrl($scope) {
$scope.options = [{value: 'a'},{value: 'b'}];
$scope.alphabet = undefined;
var oldSelect = undefined;
$scope.confirmChange = function() {
console.log(arguments);
confirmDialog($scope.alphabet, function() {
oldSelect = $scope.alphabet;
},
function() {
$scope.$apply(function() {$scope.alphabet = oldSelect;});
});
}
}