Задать вопрос

Как передать значение из typeahead в input при выборе?

Пытаюсь передать выбранное значение из https://github.com/twitter/typeahead.js в input

HTML
<div id="remote" class="sm-calc-form">
  <form action="<?php bloginfo('siteurl'); ?>" name="myform2" method="get">
      <input id="myfield" type="text" class="typeahead" placeholder="Название" name="s" />
      <input type="text" placeholder="Сумма" name="sum" />
	   <input type="text" name="postid" id="postid" />
      <input id="fakesubmit" type="submit" name="submit" value="Рассчитать" />
  </form>
</div>


JS:
var source = [{
  "ID": 1108,
  "post_title": "Name1"
}, {
  "ID": 1059,
  "post_title": "Name2"
}, {
  "ID": 591,
  "post_title": "Name3"
}]


var suggestions = new Bloodhound({
  local: source,
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('post_title'),
  identify: function(obj) {
    return obj.ID
  }
})

var field = $('#myfield')

field.typeahead({
  hint: true,
  highlight: true,
  minLength: 1
}, {
  name: 'ID',
  highlight: true,
  displayKey: 'post_title',
  source: suggestions.ttAdapter(),
  templates: {
    suggestion: function(c) {
      return '<div><b>' + c.post_title + '</b> ' + c.ID + '</div>'
    }
  }
})

field.on('typeahead:select', function(e, selected) {
  $(this).data("ID", selected.ID);
})

$('#fakesubmit').on('click', function(e) {
  var datacode = field.data('ID')
  console.log('data-code', datacode)
  window.alert('The data-code is: ' + datacode)

  e.preventDefault()
})


При нажатии на кнопку получается вывести нужное значение:
$('#fakesubmit').on('click', function(e) {
  var datacode = field.data('ID')
  console.log('data-code', datacode)
  window.alert('The data-code is: ' + datacode)


Как присвоить выбранное значение var datacode = field.data('ID') в скрытый imput ?
Пробовал так :
document.getElementById('postid').value = datacode ;

Не работает
https://jsfiddle.net/redmonkey73/t3cohjsd/45/
  • Вопрос задан
  • 1070 просмотров
Подписаться 1 Оценить 1 комментарий
Решения вопроса 1
redmo
@redmo Автор вопроса
в итоге сделал так
field.on('typeahead:select', function(e, selected) {
       $(this).data("code", selected.code);
       var datacode=field.data('code');
       $('#postid').val(datacode);
    })
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
Если я Вас правильно понял, то предлагаю разобрать такой код:
$('#ID').bind('typeahead:select', function(ev, suggestion) {
  choise=suggestion;
});


С его помощью Вы "поймаете" событие выбора typeahead.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы