title: How to add external data to javascript for jquery auto complete
body: <p>I'm trying to make a auto complete search bar using jquery autocomplete. The thing is I need to display Json data from an external site into my search bar.</p>
  <p>Whenever I try to put the data as such from json into the script, it's working. But when I refer external url it refuses to work.</p>
  <p>I tried implementing all json data into my script. But it takes so long to process as there will be more than 40000+ lines in my html page.</p>
  <p>The Json link for the data which I have to display is <a href="https://raw.githubusercontent.com/rreichel3/US-Stock-Symbols/main/nasdaq/nasdaq_full_tickers.json" rel="nofollow noreferrer">here</a></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;script&gt;
              $('#id_ticker').autocomplete({
        source: function(request, response) {
          var data = {
            "success": true,
            "data": [
            {
              "symbol": "AACG",
              "name": "ATA Creativity Global American Depositary Shares",
              "lastsale": "$2.19",
              "netchange": "-0.45",
              "pctchange": "-17.045%",
              "volume": "1408435",
              "marketCap": "68715455.00",
              "country": "China",
              "ipoyear": "",
              "industry": "Service to the Health Industry",
              "sector": "Miscellaneous",
              "url": "/market-activity/stocks/aacg"
            },
            {
              "symbol": "AACI",
              "name": "Armada Acquisition Corp. I Common Stock",
              "lastsale": "$9.88",
              "netchange": "0.01",
              "pctchange": "0.101%",
              "volume": "8345",
              "marketCap": "204609860.00",
              "country": "United States",
              "ipoyear": "2021",
              "industry": "",
              "sector": "",
              "url": "/market-activity/stocks/aaci"
            }],
            "additional_data": {
              "pagination": {
                "start": 0,
                "limit": 5,
                "more_items_in_collection": true,
                "next_start": 5
              }
            }
          };
          
          var datamap = data.data.map(function(i) {
            return {
              label: i.symbol + ' - ' + i.name.split(' ').slice(0, 2).join(' '),
              value: i.symbol,
              desc: i.title
            }
          });
          
          var key = request.term;
          
          datamap = datamap.filter(function(i) {
            return i.label.toLowerCase().indexOf(key.toLowerCase()) &gt;= 0;
          });
      
          response(datamap);
        },
        minLength: 1,
        delay: 500
      });
      &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>The above code works and the below code doesn't.</p>
  <pre><code>    &lt;script&gt;
          $('#id_ticker').autocomplete({
    source: function(request, response) {
      var data = {
        &quot;success&quot;: true,
        &quot;data&quot;: [&quot;https://raw.githubusercontent.com/rreichel3/US-Stock-Symbols/main/nyse/nyse_full_tickers.json&quot;
        ],
        &quot;additional_data&quot;: {
          &quot;pagination&quot;: {
            &quot;start&quot;: 0,
            &quot;limit&quot;: 5,
            &quot;more_items_in_collection&quot;: true,
            &quot;next_start&quot;: 5
          }
        }
      };
      
      var datamap = data.data.map(function(i) {
        return {
          label: i.symbol + ' - ' + i.name.split(' ').slice(0, 2).join(' '),
          value: i.symbol,
          desc: i.title
        }
      });
      
      var key = request.term;
      
      datamap = datamap.filter(function(i) {
        return i.label.toLowerCase().indexOf(key.toLowerCase()) &gt;= 0;
      });
  
      response(datamap);
    },
    minLength: 1,
    delay: 500
  });
  &lt;/script&gt;
  </code></pre>
  <p>Looking for a solution to add this and also for a solution to reduce the json key pair with only &quot;symbol&quot; and &quot;name&quot; from each corresponding data in the link.</p>