Typeahead.js包含远程URL中的动态变量

Question

我已经尝试了几个小时,在我的"远程"路径中获取变量.变量将根据另一个输入而改变.这是代码:

school_value = $('#school').val();
$('#school').change(function () {
    school_value = $(this).val();
    $('#programme').typeahead('destroy'); // I have also tried with destroy - but it doesnt work.
});
$('#programme').typeahead({
    remote: 'typeahead.php?programme&type=1&school_name=' + school_value,
    cache: false,
    limit: 10
});

变量'school_type'未在远程地址中设置,因此未被调用.

你有什么线索如何使它工作？我刚从Bootstrap 2.3切换到3,然后注意到typeahead已被弃用.以上代码适用于Bootstrap 2.3,但似乎在初始化脚本时,远程路径被锁定.

Answer 1

我找到了解决方案!码:

$('#programme').typeahead({
    remote: {
        url: 'typeahead.php?programme&type=1&school_name=',
        replace: function () {
            var q = 'typeahead.php?programme&type=1&school_name=';
            if ($('#school').val()) {
                q += encodeURIComponent($('#school').val());
            }
            return q;
        }
    },
    cache: false,
    limit: 10
});

基于这个线程回答:Bootstrap 3 typeahead.js - 远程url属性

请参阅typeahead.js文档中的函数"replace"

Answer 2

我相信已接受的答案现已过时.该remote选项不再具有replace.相反,你应该使用prepare:

$('#programme').typeahead({
    remote: {
        url: 'typeahead.php?programme&type=1&school_name=',
        prepare: function (query, settings) {
            settings.url += encodeURIComponent($('#school').val());

            return settings;
        }
    }
});

我遇到的一个问题是从另一个typeahead对象中提取值.Typeahead基本上复制了你的输入,包括所有类,所以你有两个几乎相同的对象,一个用于tt-hint类,另一个用于tt-input.我必须指定它是tt-input选择器,否则我得到的值是一个空字符串.

$('.field-make').val();  // was "" even though the field had a value
$('.field-make.tt-input').val();  // gave the correct value

Bloodhound远程选项