{"id":420,"date":"2019-09-10T13:06:46","date_gmt":"2019-09-10T05:06:46","guid":{"rendered":"http:\/\/syarman.com\/soft\/?p=420"},"modified":"2019-09-10T13:06:46","modified_gmt":"2019-09-10T05:06:46","slug":"jquery-typeahead-tidak-memaparkan-hasil-carian","status":"publish","type":"post","link":"http:\/\/syarman.com\/soft\/2019\/09\/10\/jquery-typeahead-tidak-memaparkan-hasil-carian\/","title":{"rendered":"Jquery Typeahead tidak memaparkan hasil carian"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-medium wp-image-421\" src=\"http:\/\/syarman.com\/soft\/wp-content\/uploads\/2019\/09\/typehead-300x215.jpg\" alt=\"\" width=\"300\" height=\"215\" srcset=\"http:\/\/syarman.com\/soft\/wp-content\/uploads\/2019\/09\/typehead-300x215.jpg 300w, http:\/\/syarman.com\/soft\/wp-content\/uploads\/2019\/09\/typehead-768x551.jpg 768w, http:\/\/syarman.com\/soft\/wp-content\/uploads\/2019\/09\/typehead.jpg 817w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/>Hari ini, terpaksa menghadap isu dari plugin ini <a href=\"https:\/\/twitter.github.io\/typeahead.js\/\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/twitter.github.io\/typeahead.js\/<\/a> . Ketika hantaran ini ditulis (atau lebih tepat ditaip), plugin ini masih diversi 0.11.1.<\/p>\n<p>Masalah plugin ini adalah, apabila hasil dari json lebih kecil dari had yang ditetapkan. Sebagai contoh, sekiranya kita hadkan hanya papar 5 baris hasil carian, sekiranya hasil carian tersebut bersamaan dengan 5 atau kurang dari 5, typeahead akan <em>trigger<\/em> untuk paparkan &#8220;<em>Result Not Found.<\/em>&#8221;<\/p>\n<p>Ada dua jalan penyelesaian yang boleh digunakan.<br \/>\n1. Penggunaan <strong>limit:Infinity<\/strong><\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nvar bestPictures = new Bloodhound({\r\n  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),\r\n  queryTokenizer: Bloodhound.tokenizers.whitespace,\r\n  prefetch: '..\/data\/films\/post_1960.json',\r\n  remote: {\r\n    url: '..\/data\/films\/queries\/%QUERY.json',\r\n    wildcard: '%QUERY'\r\n  }\r\n});\r\n\r\n$('#remote .typeahead').typeahead(null, {\r\n  name: 'best-pictures',\r\n  display: 'value',\r\n  limit:Infinity,\r\n  source: bestPictures\r\n});\r\n\r\n<\/pre>\n<p>Isu penggunaan limit:Infinity adalah anda perlu menguruskan had pada bahagian pelayan sekiranya ada menggunakan cara <em>remote<\/em>.<\/p>\n<p>Jadi saya mencadangkan cara yang kedua, kita ubah terus fail <a href=\"https:\/\/github.com\/twitter\/typeahead.js\/blob\/master\/dist\/typeahead.bundle.js\" target=\"_blank\" rel=\"noopener noreferrer\">typeahead.bundle.js<\/a><\/p>\n<p>Lihat baris 1707 hingga 1727<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-medium wp-image-422\" src=\"http:\/\/syarman.com\/soft\/wp-content\/uploads\/2019\/09\/typehead-1-300x170.jpg\" alt=\"\" width=\"300\" height=\"170\" srcset=\"http:\/\/syarman.com\/soft\/wp-content\/uploads\/2019\/09\/typehead-1-300x170.jpg 300w, http:\/\/syarman.com\/soft\/wp-content\/uploads\/2019\/09\/typehead-1.jpg 752w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/p>\n<p>Baris 1715<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nif (rendered &lt; that.limit &amp;&amp; that.async) {\r\n<\/pre>\n<p>Tukar kepada<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nif (rendered &lt;= that.limit &amp;&amp; that.async) {\r\n<\/pre>\n<p>Baris 1721<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nif (!canceled &amp;&amp; rendered &lt; that.limit) {\r\n<\/pre>\n<p>Tukar kepada<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nif (!canceled &amp;&amp; rendered &lt;= that.limit) {\r\n<\/pre>\n<p>Baris 1723 dan 1724<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nrendered += suggestions.length;\r\nthat._append(query, suggestions.slice(0, that.limit - rendered));\r\n<\/pre>\n<p>Tukar kepada<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nthat._append(query, suggestions.slice(0, that.limit));\r\nrendered += suggestions.length;\r\n<\/pre>\n<p>Untuk baris 1723 &amp; 1724, sumber rujukan disini (<a href=\"https:\/\/stackoverflow.com\/a\/35935557\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/stackoverflow.com\/a\/35935557<\/a>)<\/p>\n<p>Harapnya dapat membantu sekiranya anda menghadapi masalah yang sama dengan saya.<\/p>\n<p>Untuk memahami masalah ini dengan lebih mendalam boleh rajin-rajinlah membaca di<a href=\"https:\/\/www.google.com\/search?client=firefox-b-d&amp;q=typeahead+not+showing+if+result+less+than+limit\" target=\"_blank\" rel=\"noopener noreferrer\">sini.<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hari ini, terpaksa menghadap isu dari plugin ini https:\/\/twitter.github.io\/typeahead.js\/ . Ketika hantaran ini ditulis (atau lebih tepat ditaip), plugin ini masih diversi 0.11.1. Masalah plugin ini adalah, apabila hasil dari json lebih kecil dari had yang ditetapkan. Sebagai contoh, sekiranya kita hadkan hanya papar 5 baris hasil carian, sekiranya hasil carian tersebut bersamaan dengan 5 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":422,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,5,32],"tags":[],"class_list":["post-420","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-code","category-javascript","category-jquery"],"_links":{"self":[{"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/posts\/420","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/comments?post=420"}],"version-history":[{"count":2,"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/posts\/420\/revisions"}],"predecessor-version":[{"id":424,"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/posts\/420\/revisions\/424"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/media\/422"}],"wp:attachment":[{"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/media?parent=420"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/categories?post=420"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/syarman.com\/soft\/wp-json\/wp\/v2\/tags?post=420"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}