title: elasticlunr.js not showing results for search query
body: <p>I used <a href="http://elasticlunr.com/" rel="nofollow noreferrer">elasticlunr.js</a> search engine.  </p>
  
  <p>I edited their example source code</p>
  
  <pre><code>$('input').bind("enterKey", function (e) {
  
      var value_test = $("#inputSuccess1").val();
  
      if ($(this).val() &lt; 2) return
      var config = $('#configuration').val();
      config.trim();
      var json_config = null;
      if (config != '') {
          json_config = new elasticlunr.Configuration(config, idx.getFields()).get();
      }
  
      var query = value_test;
      var results = null;
  
      console.log(query);
  
      if (json_config == null) {
          results = idx.search(query).map(function (result) {
              console.log(result);
              return questions.filter(function (q) {
                  console.log(q);
                  return q.page_id === parseInt(result.ref, 10)
              })[0]
          })
      } else {
          results = idx.search(query, json_config).map(function (result) {
              return questions.filter(function (q) {
                  return q.page_id === parseInt(result.ref, 10)
              })[0]
          })
      }
      renderQuestionList(results);
      console.log(results);
  });
  </code></pre>
  
  <p>All stored search results are displayed on load but when I enter a search query, it returns the supposed un-edited search results. Though the search result array is populated (for e.g.) by 2 items , it is still undefined. I tried to put my own result (just 1) on the example_index.json and tried to input tags relevant to it. It still doesn't show.</p>
  
  <p>HTML CODE</p>
  
  <pre><code>&lt;body&gt;
  &lt;div id="wrapper"&gt;
      &lt;main class="main" role="main" style="margin-top: 30px"&gt;
          &lt;div class="container"&gt;
              &lt;div class="row"&gt;
                  &lt;header style="margin-left: 15px; margin-right: 15px;"&gt;
                      &lt;h1&gt;Elasticlunr&lt;span&gt;.js&lt;/span&gt;&lt;/h1&gt;
                      &lt;h2&gt;Lightweight full-text search engine in Javascript for browser search and offline search.&lt;/h2&gt;
                  &lt;/header&gt;
              &lt;/div&gt;
  
              &lt;div class="row"&gt;
                  &lt;div class="col-md-6"&gt;
                      &lt;span&gt;&lt;strong&gt;&lt;i&gt;Search Configuration:&lt;/i&gt;&lt;/strong&gt;&lt;/span&gt;
                      &lt;textarea id="configuration" class="form-control" rows="6" style="font-size: 0.8em;"&gt;&lt;/textarea&gt;
                  &lt;/div&gt;
  
                  &lt;div class="col-md-6" style="margin-left: 0px; margin-right: 0px; padding-right: 0px; padding-left: 0px;"&gt;
                      &lt;span&gt;&lt;strong&gt;&lt;i&gt;Configuration Example:&lt;/i&gt;&lt;/strong&gt;&lt;/span&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;div class="row" style="margin-left: 0px; margin-right: 0px; border-top-style: solid; border-top-width: 0px; padding-top: 10px;"&gt;
                  &lt;div class="col-md-6" style="padding-left: 0px; padding-right: 50px"&gt;
                      &lt;form&gt;
                          &lt;div class="form-group has-success"&gt;
                              &lt;div class="col-xs-9" style="padding-left: 0px;"&gt;
                                  &lt;input type="search" class="form-control" id="inputSuccess1" &gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div&gt;&lt;a class="all btn btn-primary btn-block" href="#"&gt;All&lt;/a&gt;&lt;/div&gt;
                      &lt;/form&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-12" style="margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid rgba(7, 94, 115, 0.3); padding-left: 0px;"&gt;&lt;/div&gt;
              &lt;/div&gt;
  
              &lt;div class="row" style="margin-left: 0px; margin-right: 0px;"&gt;
                  &lt;div class="col-md-6" style="margin-left: 0px; margin-right: 0px;"&gt;
                      &lt;div id='question-list-container' style="margin-left: 0px; margin-right: 0px;"&gt;&lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div class="col-md-6" style="margin-left: 0px; margin-right: 0px; padding-right: 0px; padding-left: 0px;"&gt;
                      &lt;div id='question-view-container' style="margin-left: 0px; margin-right: 0px; padding-right: 0px; padding-left: 0px;"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-12" style="padding-bottom: 15px; border-bottom:1px solid rgba(7,94,115,0.3);"&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/main&gt;
      &lt;/div&gt;
      &lt;!-- end of wrapper --&gt;
  
      &lt;!-- Begin footer --&gt;
      &lt;footer class="footer vertical-center"&gt;
          &lt;div class="container"&gt;
              &lt;p class="pull-right text-muted"&gt;&lt;a href="#"&gt;Back to top&lt;/a&gt;
              &lt;/p&gt;
              &lt;p class="text-muted"&gt;Copyright &amp;copy; Wei Song 2015.
                  &lt;a href="https://github.com/weixsong"&gt;https://github.com/weixsong&lt;/a&gt; watkinsong@163.com.  Donate by Alipay: watkinsong@163.com&lt;/p&gt;
          &lt;/div&gt;
      &lt;/footer&gt;
  
      &lt;script&gt;
          (function(hijs) {
              //
              // hijs - JavaScript Syntax Highlighter
              //
              // Copyright (c) 2010 Alexis Sellier
              //
  
              // All elements which match this will be syntax highlighted.
              var selector = hijs || 'pre';
  
              var keywords = ('var function if else for while break switch case do new null in with void ' + 'continue delete return this true false throw catch typeof with instanceof').split(' '),
                  special = ('eval window document undefined NaN Infinity parseInt parseFloat ' + 'encodeURI decodeURI encodeURIComponent decodeURIComponent').split(' ');
  
              // Syntax definition
              // The key becomes the class name of the &lt;span&gt;
              // around the matched block of code.
              var syntax = [
                  ['comment', /(\/\*(?:[^*\n]|\*+[^\/*])*\*+\/)/g],
                  ['comment', /(\/\/[^\n]*)/g],
                  ['string', /("(?:(?!")[^\\\n]|\\.)*"|'(?:(?!')[^\\\n]|\\.)*')/g],
                  ['regexp', /(\/.+\/[mgi]*)(?!\s*\w)/g],
                  ['class', /\b([A-Z][a-zA-Z]+)\b/g],
                  ['number', /\b([0-9]+(?:\.[0-9]+)?)\b/g],
                  ['keyword', new(RegExp)('\\b(' + keywords.join('|') + ')\\b', 'g')],
                  ['special', new(RegExp)('\\b(' + special.join('|') + ')\\b', 'g')]
              ];
              var nodes, table = {};
  
              if (/^[a-z]+$/.test(selector)) {
                  nodes = document.getElementsByTagName(selector);
              } else if (/^\.[\w-]+$/.test(selector)) {
                  nodes = document.getElementsByClassName(selector.slice(1));
              } else if (document.querySelectorAll) {
                  nodes = document.querySelectorAll(selector);
              } else {
                  nodes = [];
              }
  
              for (var i = 0, children; i &lt; nodes.length; i++) {
                  children = nodes[i].childNodes;
  
                  for (var j = 0, str; j &lt; children.length; j++) {
                      code = children[j];
  
                      if (code.length &gt;= 0) { // It's a text node
                          // Don't highlight command-line snippets
                          if (!/^\$/.test(code.nodeValue.trim())) {
                              syntax.forEach(function(s) {
                                  var k = s[0],
                                      v = s[1];
                                  code.nodeValue = code.nodeValue.replace(v, function(_, m) {
                                      return '\u00ab' + encode(k) + '\u00b7' + encode(m) +
                                          '\u00b7' + encode(k) + '\u00bb';
                                  });
                              });
                          }
                      }
                  }
              }
              for (var i = 0; i &lt; nodes.length; i++) {
                  nodes[i].innerHTML =
                      nodes[i].innerHTML.replace(/\u00ab(.+?)\u00b7(.+?)\u00b7\1\u00bb/g, function(_, name, value) {
                          value = value.replace(/\u00ab[^\u00b7]+\u00b7/g, '').replace(/\u00b7[^\u00bb]+\u00bb/g, '');
                          return '&lt;span class="' + decode(name) + '"&gt;' + escape(decode(value)) + '&lt;/span&gt;';
                      });
              }
  
              function escape(str) {
                  return str.replace(/&lt;/g, '&amp;lt;').replace(/&gt;/g, '&amp;gt;');
              }
  
              // Encode ASCII characters to, and from Braille
              function encode(str, encoded) {
                  table[encoded = str.split('').map(function(s) {
                      if (s.charCodeAt(0) &gt; 127) {
                          return s
                      }
                      return String.fromCharCode(s.charCodeAt(0) + 0x2800);
                  }).join('')] = str;
                  return encoded;
              }
  
              function decode(str) {
                  if (str in table) {
                      return table[str];
                  } else {
                      return str.trim().split('').map(function(s) {
                          if (s.charCodeAt(0) - 0x2800 &gt; 127) {
                              return s
                          }
                          return String.fromCharCode(s.charCodeAt(0) - 0x2800);
                      }).join('');
                  }
              }
  
          })(window.hijs);
      &lt;/script&gt;
  </code></pre>
  
  <p>3rd edit:</p>
  
  <p>I have this code </p>
  
  <pre><code>$('input').keyup(function(e){
  if(e.keyCode == 13)
  {
      $(this).trigger("enterKey");
  }
  </code></pre>
  
  <p>});</p>
  
  <p>I use xampp and when I press enter this is what happens. those "Empty list" are from the previous .json file but with a different id . I can't find that part</p>
  
  <p><a href="http://elasticlunr.com/" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YRDm4.png" alt="enter image description here"></a></p>
  
  <p>it has a lot of codes so i uploaded it here (edited: removed link. fixed now)</p>