Form: add address auto complete
This commit is contained in:
parent
1a485f173e
commit
1b42766836
5 changed files with 46 additions and 1 deletions
|
@ -18,4 +18,5 @@
|
|||
//= require highcharts
|
||||
//= require chartkick
|
||||
//= require select2
|
||||
//= require typeahead.bundle
|
||||
//= require_tree .
|
||||
|
|
27
app/assets/javascripts/new_design/champs/address.js
Normal file
27
app/assets/javascripts/new_design/champs/address.js
Normal file
|
@ -0,0 +1,27 @@
|
|||
(function () {
|
||||
var display = 'label';
|
||||
|
||||
var bloodhound = new Bloodhound({
|
||||
datumTokenizer: Bloodhound.tokenizers.obj.whitespace(display),
|
||||
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
|
||||
remote: {
|
||||
url: '/ban/search?request=%QUERY',
|
||||
wildcard: '%QUERY'
|
||||
}
|
||||
});
|
||||
|
||||
bloodhound.initialize();
|
||||
|
||||
var bindTypeahead = function() {
|
||||
$("input[data-address='true']").typeahead({
|
||||
minLength: 1
|
||||
}, {
|
||||
display: display,
|
||||
source: bloodhound,
|
||||
limit: 5
|
||||
});
|
||||
};
|
||||
|
||||
document.addEventListener('turbolinks:load', bindTypeahead);
|
||||
})();
|
|
@ -12,7 +12,7 @@
|
|||
display: inline-block;
|
||||
}
|
||||
|
||||
input[type=text],
|
||||
input[type=text]:not([data-address='true']),
|
||||
input[type=email],
|
||||
input[type=password],
|
||||
input[type=date],
|
||||
|
@ -116,6 +116,21 @@
|
|||
// scss-lint:enable
|
||||
}
|
||||
|
||||
.twitter-typeahead {
|
||||
margin-bottom: 2 * $default-padding;
|
||||
}
|
||||
|
||||
input.tt-input,
|
||||
input.tt-hint {
|
||||
border-radius: 4px;
|
||||
border: solid 1px $border-grey;
|
||||
padding: $default-padding;
|
||||
}
|
||||
|
||||
input.tt-hint {
|
||||
color: $grey;
|
||||
}
|
||||
|
||||
.datetime {
|
||||
input[type=date] {
|
||||
display: inline-block;
|
||||
|
|
|
@ -5,4 +5,5 @@
|
|||
// = require ./fonts
|
||||
// = require leaflet.1.1.0
|
||||
// = require select2
|
||||
// = require typeahead
|
||||
// = require_tree .
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
= render partial: 'new_gestionnaire/dossiers/champs/champ_label', locals: { champ: champ }
|
||||
|
||||
%input{ type: 'text',
|
||||
'data-address': 'true',
|
||||
name: "champs['#{champ.id}']",
|
||||
id: "champs_#{champ.id}",
|
||||
placeholder: champ.libelle,
|
||||
|
|
Loading…
Reference in a new issue