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>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-debug.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore.js"></script>
    <style>
        .overflow{
            height: 300px;
            overflow: auto;
        }
        .selected{
            background-color:#5ae;
        }
        .indeterminate{
            background: #eee;
            border: 1px solid #aaa;
        }
    </style>
</head>
<body>
    <select data-bind="options: options, value:option"></select>
    
    <script>
    jQuery(document).ready(function($){
        ko.applyBindings(new AppData());
    })
    </script>
</body>
</html>
 
console.clear();
​
var AppData = function() {
    self = {};
    self.options = ko.observableArray(['one','two','three']);
    self._selected = ko.observable();
    self.option = ko.computed({
        read:function(){
            return self._selected;
        },
        write: function(data){
            if(data){
                if(confirm('are you sure?')){
                    self._selected(data);
                }else{
                    //reset
                }
            }
        }
    });
​
    return self;
};
ko.applyBindings(new AppData());
Output

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

Dismiss x
public
Bin info
zhgaborpro
0viewers