Question

//search
 jQuery(document).ready(function($) {
            // Set the Options for "Bloodhound" suggestion engine
            var engine = new Bloodhound({
                prefetch: {
                    url: '/search',
                },
                remote: {
                    url: '/find?q=%QUERY%',
                    wildcard: '%QUERY%'
                },
                datumTokenizer: Bloodhound.tokenizers.whitespace('q'),
                queryTokenizer: Bloodhound.tokenizers.whitespace
            });
            $(".search-input").typeahead({
                hint: true,
                highlight: true,
                minLength: 1
            }, {
                source: engine.ttAdapter(),
                name: 'searchresult',
                display: 'name', //what to display 
                templates: {
                    empty: [
                        '<div class="list-group search-results-dropdown"><div class="list-group-item">Nothing found.</div></div>'
                    ],
                    header: [
                        '<div class="list-group search-results-dropdown">'
                    ],
                    suggestion: function (data) {
                        return '<a href="/courses/' + data.slug + '" class="list-group-item">' + data.name + '</a>'
                    }
                }
            }).on('keyup', this, function (event) {
        if (event.keyCode == 13) {
          var a = this.value;
          a = string_to_slug(a);
          $.ajax({
                url: "{{url('getCourse')}}",
                data: 
                {'slug':a,
                    "_token": "{{ csrf_token() }}"}, 
                type: "POST",
                success: function (data) {
                    console.log(data);
                    if (data.slug === undefined) {
                    }else{
                    window.location.href = "/courses/" + data.slug ;
                    }
                },
                error: function (xhr, ajaxOptions, thrownError) {

                },
                complete: function () {

                }
            });





        }
    });

        });

表格

  <form>
      <div class="input-group">
          <input type="text" class="form-control search-input" placeholder="Search...">
      </div>
  </form>


function string_to_slug (str) {
    str = str.replace(/^\s+|\s+$/g, ''); // trim
    str = str.toLowerCase();

    // remove accents, swap ñ for n, etc
    var from = "àáäâèéëêìíïîòóöôùúüûñç·/_,:;";
    var to   = "aaaaeeeeiiiioooouuuunc------";
    for (var i=0, l=from.length ; i<l ; i++) {
        str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i));
    }

    str = str.replace(/[^a-z0-9 -]/g, '') // remove invalid chars
        .replace(/\s+/g, '-') // collapse whitespace and replace by -
        .replace(/-+/g, '-'); // collapse dashes

    return str;
}

其他任何方法也可以做到这一点。我尝试使用不可见的提交按钮，但仍然无法正常工作。Ajax需要花费很多时间来完成任务。在这里单击建议已经从数据库中获取了价值。输入密钥我没有得到那个值。所以我使用slugify方法使我拥有大量数据。但是我需要的是从数据库获取值作为链接，而不是使用ajax并在按Enter键时使用它。 / p>

Twitter typahead.js在按Enter键时的作用与单击相同

0 个答案: