1
$.ajax({
    url: "https://en.wikipedia.org/w/api.php",
    dataType: "jsonp",
    data: {
        'action': "opensearch",
        'format': "json",
        'search': search
    },
    success: function (data) {
        var suggestions = '';
        data[1].forEach(d => {
            suggestions += `<option value="${d}">`;
        });
        console.log(data);
        $('#searchList').html(suggestions);
        console.log(suggestions);
    }
});

Difference between hashtag symbol from wikipedia search api and local server

In other words the datalist populates just fine normally with other characters including @ or $, but when using # it will not drop down and show the suggestions even though the datalist is populated with the correct items when inspecting the element.

edit: by localhost I meant I changed the endpoint to my server so I could see what would happen if I sent back the option list with a hashtag. It worked fine and I noticed the different font between the hashtags sent by my server vs wiki's opensearch.

edit: The search variable comes from the input box like this- 

<form class="pSearch form-inline" method="post" action="">
              <input class="pSearch" type="text" id="searchTerm" name="searchTerms" placeholder="Search" aria-label="Search" 
             list="searchList" autocomplete="off" spellcheck="true">
      <datalist id="searchList"></datalist>

I listen for input with the keyup function-

$('#searchTerm').keyup(function (e) {

    var search = $(this).val();

Then I send the variable search to the opensearch api-

    $.ajax({...})
}

Hardcoding the hashtag instead of using a variable works fine- "#". I tried JSON.stringify(search), but it made no difference.

Bergi
  • 630,263
  • 148
  • 957
  • 1,375
jmoney
  • 55
  • 1
  • 8
  • 1
    Please post the result as text, not a painting. – Bergi Nov 30 '19 at 20:28
  • What exactly do you mean by "localhost"? What are you doing on your local host, what you doing with wikipedia? – Bergi Nov 30 '19 at 20:31
  • edited my question to answer better explain what I meant Bergi. I used an image because I wondered if the difference between the two "#" characters had anything to do with it. – jmoney Nov 30 '19 at 23:01
  • Please post the two server responses verbatim - they appear to be different. Then after establishing that, you probably will need to fix your local server to send the correct data. – Bergi Nov 30 '19 at 23:58
  • There are multiple different characters: #♯⋕＃﹟ (from [Wikipedia](https://en.wikipedia.org/wiki/Number_sign)). Maybe you used the wrong one in the response sent by your server. If you had posted text, I could confirm it. – Bergi Dec 01 '19 at 00:02
  • First result from wikipedia is ＃2 ¡Una mas! , first result from my server is #279886. They do look different. The datalist populates just fine when "#" is returned from my server. Wikipedia's "＃" will not populate the datalist. What is the difference between the two? Searching 'difference between ＃and #' did not yield relevant results. – jmoney Dec 01 '19 at 02:46
  • When I put the two into the website https://unicodelookup.com/ I got number sign for the working hashtag, and utf-8 code EF BC 83 for wikipedia's. – jmoney Dec 01 '19 at 02:59
  • That's a "*FULLWIDTH NUMBER SIGN*", not the normal number sign. No idea how you made your server generate that. Fix it. Or show us the serverside code if you need help with it. – Bergi Dec 01 '19 at 03:01
  • Bergi, That is coming from the wiki open search api, not my server. – jmoney Dec 01 '19 at 03:05
  • I thought you said the wikipedia api is working, and your local server is not? – Bergi Dec 01 '19 at 03:07

1 Answers1

1

The problem is that Wikipedia article titles cannot contain a # character. Apparently some people got creative and instead used the FULLWIDTH NUMBER SIGN ＃ instead to circumvent this limitation.

Correspondingly, the normal search would find only a single accurate result for #, but the Opensearch API that you are using appears to do some unicode-aware fuzzy matching and returns pages beginning with ＃. The <datalist> won't consider those however.

Bergi
  • 630,263
  • 148
  • 957
  • 1,375
  • Okay, thank you! Now I won't waste anymore time on it. If I wouldn't have learned Wikipedia titles disallow #, I would have wasted so much more time than I already have. I really appreciate it! If anyone runs into similar issues, check out this question- https://stackoverflow.com/questions/553463/jquery-ajax-character-encoding – jmoney Dec 01 '19 at 04:55