alex/restaurant-search
1
Fork 0
Code Releases Activity

Use bootstrap-select for keyword selection control

Browse Source
This commit is contained in:
Alex Yatskov 2014-09-15 18:01:22 +09:00
parent a7fc6c1762
commit d21d0f8879
3 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
client/application.js
View File

@ -86,6 +86,8 @@
},
ready: function() {
$('.selectpicker').selectpicker();
$.getJSON('/node/keywords', function(keywords) {
for (var i = 0, count = keywords.length; i < count; ++i) {
$('#keywords').append($('<option></option>', {
@ -94,6 +96,7 @@
}));
}
$('.selectpicker').selectpicker('refresh');
$('#search').prop('disabled', false);
$('#search').click(onSearch);
});

3
client/bower.json
View File

@ -17,6 +17,7 @@
"closurelibrary": "*",
"fabric": "~1.4.8",
"handlebars": "~1.3.0",
"underscore": "~1.6.0"
"underscore": "~1.6.0",
"bootstrap-select": "~1.6.2"
}
}

4
client/index.html
View File

@ -5,6 +5,7 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="bower_components/bootstrap-select/dist/css/bootstrap-select.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
@ -21,7 +22,7 @@
<div class="form-group">
<label for="keywords" class="col-md-2 control-label">Keywords</label>
<div class="col-md-10">
<select id="keywords" class="form-control" name="keywords" multiple="multiple"></select>
<select id="keywords" class="form-control selectpicker" multiple="multiple" data-max-option="4" data-live-search="data-live-search" name="keywords"></select>
</div>
</div>
<div class="form-group">
@ -103,6 +104,7 @@
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/fabric/dist/fabric.min.js"></script>
<script src="bower_components/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="application.js"></script>
<script src="grapher.js"></script>