{"type":"rich","version":"1.0","provider_name":"phorkie","provider_url":"https:\/\/p.cweiske.de\/","title":"awesomplete ajax","author_name":"Christian Weiske","cache_age":86400,"width":900,"height":900,"html":"<!-- embedding all files of https:\/\/p.cweiske.de\/414 -->\n<link rel=\"stylesheet\" href=\"https:\/\/p.cweiske.de\/css\/embed.css\"\/>\n<div class=\"phork\" id=\"414\">\n    <div class=\"phork-file\">\n <div class=\"phork-content\">\n  <style type=\"text\/css\">\/**\n * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann\n * (http:\/\/qbnz.com\/highlighter\/ and http:\/\/geshi.org\/)\n *\/\n.javascript .de1, .javascript .de2 {font: normal normal 1em\/1.2em monospace; margin:0; padding:0; background:none; vertical-align:top;}\n.javascript  {font-family:monospace;}\n.javascript .imp {font-weight: bold; color: red;}\n.javascript li, .javascript .li1 {color: #DDD;}\n.javascript .ln {width:1px;text-align:right;margin:0;padding:0 2px;vertical-align:top;}\n.javascript .kw1 {color: #000066; font-weight: bold;}\n.javascript .kw2 {color: #003366; font-weight: bold;}\n.javascript .kw3 {color: #000066;}\n.javascript .co1 {color: #006600; font-style: italic;}\n.javascript .co2 {color: #009966; font-style: italic;}\n.javascript .coMULTI {color: #006600; font-style: italic;}\n.javascript .es0 {color: #000099; font-weight: bold;}\n.javascript .br0 {color: #009900;}\n.javascript .sy0 {color: #339933;}\n.javascript .st0 {color: #3366CC;}\n.javascript .nu0 {color: #CC0000;}\n.javascript .me1 {color: #660066;}\n.javascript span.xtra { display:block; }\n<\/style><div class=\"code\"><table class=\"javascript\"><tbody><tr class=\"li1\"><td class=\"ln\"><pre class=\"de1\">1\n2\n3\n4\n5\n6\n7\n8\n9\n10\n11\n12\n13\n14\n15\n16\n17\n18\n19\n20\n21\n22\n23\n24\n25\n26\n<\/pre><\/td><td class=\"de1\"><pre class=\"de1\"><span class=\"co1\">\/\/ https:\/\/leaverou.github.io\/awesomplete\/<\/span>\n&#160; <span class=\"kw2\">var<\/span> search <span class=\"sy0\">=<\/span> <span class=\"kw2\">new<\/span> Awesomplete<span class=\"br0\">&#40;<\/span><span class=\"st0\">'#producerdbsearch'<\/span><span class=\"sy0\">,<\/span> <span class=\"br0\">&#123;<\/span>\n&#160; minChars<span class=\"sy0\">:<\/span> <span class=\"nu0\">0<\/span><span class=\"sy0\">,<\/span>\n&#160; <span class=\"br0\">&#125;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160; document.<span class=\"me1\">getElementById<\/span><span class=\"br0\">&#40;<\/span><span class=\"st0\">'producerdbsearch'<\/span><span class=\"br0\">&#41;<\/span>.<span class=\"me1\">addEventListener<\/span><span class=\"br0\">&#40;<\/span><span class=\"st0\">'input'<\/span><span class=\"sy0\">,<\/span> <span class=\"kw2\">function<\/span><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n&#160; &#160; &#160; <span class=\"kw2\">var<\/span> query <span class=\"sy0\">=<\/span> <span class=\"kw1\">this<\/span>.<span class=\"me1\">value<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; console.<span class=\"me1\">log<\/span><span class=\"br0\">&#40;<\/span><span class=\"st0\">'adf'<\/span><span class=\"sy0\">,<\/span> query<span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160;\n&#160; &#160; &#160; <span class=\"kw2\">var<\/span> xhr <span class=\"sy0\">=<\/span> <span class=\"kw2\">new<\/span> XMLHttpRequest<span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span>\n&#160; &#160; &#160; xhr.<span class=\"kw3\">open<\/span><span class=\"br0\">&#40;<\/span><span class=\"st0\">'GET'<\/span><span class=\"sy0\">,<\/span> <span class=\"st0\">'\/somefoo&amp;q='<\/span> <span class=\"sy0\">+<\/span> query<span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; xhr.<span class=\"me1\">onreadystatechange<\/span> <span class=\"sy0\">=<\/span> <span class=\"kw2\">function<\/span><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n&#160; &#160; &#160; &#160; &#160; <span class=\"kw1\">if<\/span> <span class=\"br0\">&#40;<\/span>xhr.<span class=\"me1\">readyState<\/span><span class=\"sy0\">&gt;<\/span><span class=\"nu0\">3<\/span> <span class=\"sy0\">&amp;&amp;<\/span> xhr.<span class=\"kw3\">status<\/span><span class=\"sy0\">==<\/span><span class=\"nu0\">200<\/span><span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n&#160; &#160; &#160; &#160; &#160; &#160; &#160; showSearchResults<span class=\"br0\">&#40;<\/span>JSON.<span class=\"me1\">parse<\/span><span class=\"br0\">&#40;<\/span>xhr.<span class=\"me1\">response<\/span><span class=\"br0\">&#41;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; &#160; &#160; <span class=\"br0\">&#125;<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; <span class=\"br0\">&#125;<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; xhr.<span class=\"me1\">setRequestHeader<\/span><span class=\"br0\">&#40;<\/span><span class=\"st0\">'X-Requested-With'<\/span><span class=\"sy0\">,<\/span> <span class=\"st0\">'XMLHttpRequest'<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; xhr.<span class=\"me1\">send<\/span><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160; <span class=\"br0\">&#125;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160; <span class=\"kw2\">function<\/span> showSearchResults<span class=\"br0\">&#40;<\/span>list<span class=\"br0\">&#41;<\/span>\n&#160; <span class=\"br0\">&#123;<\/span>\n&#160; &#160; &#160; <span class=\"kw2\">var<\/span> newlist <span class=\"sy0\">=<\/span> <span class=\"br0\">&#91;<\/span><span class=\"br0\">&#93;<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; list.<span class=\"me1\">forEach<\/span><span class=\"br0\">&#40;<\/span><span class=\"kw2\">function<\/span><span class=\"br0\">&#40;<\/span>obj<span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span> newlist.<span class=\"me1\">push<\/span><span class=\"br0\">&#40;<\/span>obj.<span class=\"me1\">title<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span><span class=\"br0\">&#125;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&#160; &#160; &#160; search.<span class=\"me1\">list<\/span> <span class=\"sy0\">=<\/span> newlist<span class=\"sy0\">;<\/span>\n&#160; <span class=\"br0\">&#125;<\/span>\n&#160;\n&#160;<\/pre><\/td><\/tr><\/tbody><\/table><\/div>\n <\/div>\n <div class=\"phork-meta\">\n  <a href=\"https:\/\/p.cweiske.de\/414\/rev-raw\/18471f392e6732643572db2ca4ff300954af2aaa\/phork0.js\" style=\"float: right\">view raw source<\/a>\n  <a href=\"https:\/\/p.cweiske.de\/414#phork0.js\">phork0.js<\/a>\n <\/div>\n<\/div>\n<\/div>\n"}