CODEWITHSUNDEEP
javascriptphpsemantic-ui
Bogdan
Bogdan

Reputation: 85

Semantic UI autosuggest Search Bar doesn't load result in Firefox when changing the php file (that returns the same syntax)

I started to use Semantic UI recently and I got into this very frustrating situation, where in the search bar, when I change the php file that sends the same syntax, the result is not loading anymore under the search bar. Any ideas what could be the problem? It looks so simple and elementary, but it just doesn't work.

These are the two twin files and their result:

keyword_suggest.php?term=sauerkraut

returns:

{"results":[{"name":"Sauerkraut, canned, solids and liquids","url":"product.php?id=11439"}]}

and also this file

sci_name_suggest.php?term=sinapis

returns:

{"results":[{"name":"Sinapis alba and Brassica juncea","url":"produs.php?id=2024"}]}

Considering that they both return the same syntax, how is it possible that when I change from first file to the second, there are no results in the Semantic UI search bar?

Source file was changed, but no results

This is the javascript that I use:

function page_home() {

$('.ui.search')
    .search({
        apiSettings: {
            url: '//www.website.com/keyword_suggest.php?term={query}'
        },
        fields: {
            results: 'results',
            title: 'name'
        },
        minCharacters : 2
    })
;
}

if($('.page_home').length) {
    page_home();
}

In the second example I changed the url to:

//www.website.com/sci_name_suggest.php?term={query}

But it doesn't load the result, even though there is one result for "sinapis".

How is it possible? They both send back the same syntax.

At the end of both php files there is this json:

echo '{"results":' . json_encode($values) . '}';

This is the Semantic UI search bar:

<div class="ui attached stackable">
  <div class="ui container page_home">
      <div class="ui center aligned grid">
          <div class="">

              <h2>Search in database:</h2>

              <div class="ui right aligned search">
                  <div class="ui left icon input">
                      <input class="prompt" type="text" placeholder="Search...">
                      <i class="search icon"></i>
                  </div>
              </div>

          </div>
      </div>
  </div>
</div>

Any ideas and suggestions are appreciated, thank you !

Upvotes: 2

Views: 238

Answers (1)

Francisc
Francisc

Reputation: 393

I suggest you check the console for warning, errors, semantic ui will act this way if the request is not successful. Also make sure you handle the Cross-Origin Policy properly.

Upvotes: 1

Related Questions