Add Typeahead for Author input

This commit is contained in:
Cervinko Cera
2016-03-29 00:09:11 +02:00
parent d979ed89c6
commit cd0aeb2857
5 changed files with 657 additions and 10 deletions
+21 -1
View File
@@ -1,6 +1,26 @@
{% extends "layout.html" %}
{% block body %}
{% if book %}
<script type="text/javascript">
$(document).ready(function(){
$('input.typeahead').typeahead({
name: 'accounts',
source: function (query, process) {
$.ajax({
url: '{{ url_for('get_authors_json') }} ',
type: 'POST',
dataType: 'JSON',
data: 'query=' + query,
success: function(data) {
console.log(data);
process(data);
}
});
}
});
});
</script>
<div class="col-sm-3 col-lg-3 col-xs-12">
<div class="cover">
{% if book.has_cover is defined %}
@@ -21,7 +41,7 @@
<p>{{author.name.join(" & ")}}</p>
{% endfor %}
{% endif %}
<input type="text" class="form-control" name="author_name" id="bookAuthor" value="{{book.authors[0].name}}">
<input type="text" data-provide="typeahead" class="form-control typeahead" name="author_name" id="bookAuthor" autocomplete="off" value="{{book.authors[0].name}}">
</div>
<div class="form-group">
<label for="description">Description</label>
+11 -9
View File
@@ -18,6 +18,17 @@
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="{{ url_for('static', filename='js/bootstrap.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/bootstrap3-typeahead.js') }}"></script>
<script src="{{ url_for('static', filename='js/underscore.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/intention.js') }}"></script>
<script src="{{ url_for('static', filename='js/context.js') }}"></script>
<script src="{{ url_for('static', filename='js/plugins.js') }}"></script>
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
</head>
<body>
<!-- Static navbar -->
@@ -127,14 +138,5 @@
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="{{ url_for('static', filename='js/bootstrap.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/underscore.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/intention.js') }}"></script>
<script src="{{ url_for('static', filename='js/context.js') }}"></script>
<script src="{{ url_for('static', filename='js/plugins.js') }}"></script>
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
</body>
</html>