首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >初始化物化-使用ajax和jquery的api调用自动完成数据集

初始化物化-使用ajax和jquery的api调用自动完成数据集
EN

Stack Overflow用户
提问于 2021-07-21 17:15:34
回答 2查看 77关注 0票数 3

大家早上好,我在一个PHP应用程序中使用materialize.css

我想用API调用初始化自动完成数据。

.autocomplete ()用JSON数组" data ":初始化数据,

这是我用.ajax ({..., url: '/search.php', ... datas})得到的。

但我不能把datas注入.autocomplete ()

我该怎么做呢?

源代码如下:

代码语言:javascript
代码运行次数:0
运行
复制
<body>
  <form action="">
    <div class="row">
      <div class="col s12">
        <div class="row">
          <div class="input-field col s6">
            <i class="material-icons prefix">title</i>
            <input id="searchOnAPI" name="name" type="text" class="autocomplete" value="{{ item.name }} ">
            <label for="searchOnAPI">{{ siteData('admin.titre') }}</label>
            <ul id="autocomplete-content" class="autocomplete-content"><li><a></a></li></ul>
          </div>
        </div>
      </div>
    </div>
  </form>

  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
  <script>
    $(document).ready(function () {
      $('#searchOnAPI').keyup(function () {
        $('#autocomplete-content').html('');
        let search = $(this).val();

        if (search !== "") {
          $.ajax({
            type: 'GET',
            url: '/search.php',
            data: 'search=' + encodeURIComponent(search),
            success: function (datas) {
            if (datas !== "") {
              $('#searchOnAPI').autocomplete(datas);
            } else {
            document.getElementById('autocomplete-content').innerHTML = '<ul class="autocomplete-content dropdown-content"><li><a class="black-text">{{ siteData('site.search.nodata') }}</a></li></ul>';
            }
          }
          });
        }
      });
    });
  </script>

我认为问题出在这里:

变量数据...

但是我不再理解这个错误了。

代码语言:javascript
代码运行次数:0
运行
复制
success: function (datas) {
   if (datas !== "") {
      $('#searchOnAPI').autocomplete(datas);
   }

搜索页面的代码:和调用API

代码语言:javascript
代码运行次数:0
运行
复制
<?php

if (isset($_GET['search']) && !empty($_GET['search'])) {
    $search = trim(htmlspecialchars($_GET['search']));

    $curl = curl_init();
        curl_setopt_array($curl, [
            CURLOPT_URL             => "https://api.themoviedb.org/3/search/multi?api_key=". API_KEY ."&language=fr-FR&query=$search",
            CURLOPT_CAINFO          => dirname(__DIR__) . DIRECTORY_SEPARATOR . 'lib' . DIRECTORY_SEPARATOR ."cert.tmdb.cer", //api.themoviedb.org
            CURLOPT_RETURNTRANSFER  => true,
            CURLOPT_FOLLOWLOCATION  => true,
            CURLOPT_ENCODING        => "",
            CURLOPT_MAXREDIRS       => 10,
            CURLOPT_TIMEOUT         => 10,
            CURLOPT_HTTP_VERSION    => CURL_HTTP_VERSION_1_1,
            CURLOPT_CUSTOMREQUEST   => "GET"
        ]);

        $response = curl_exec($curl);
        $err = curl_error($curl);


        $response = json_decode($response, true);
        $err = json_decode($err, true);
        $datas = [];

        if (!is_null($err) || $response === null || !isset($response['results'])) {
            $datas[] = ['No Data' => null];
        } else {

            $response = $response['results'];
            for ($i = 0; $i <= 5; $i++) {
                if (isset($response[$i]['title'])) {
                    $datas[] = $response[$i]['title'] ;
                } elseif (isset($response[$i]['name'])) {
                    $datas[] = $response[$i]['name'];
                }
            }
            
            echo json_encode(array_fill_keys(['data'], array_fill_keys($datas, null)), true);
        }

}

下面是以搜索页面的json格式返回的api。

代码语言:javascript
代码运行次数:0
运行
复制
{
  "data": {
    "O Amor Acontece": null,
    "Quem Quer Namorar Com o Agricultor?": null,
    "O'": null,
    "O Clone": null,
    "Hawaï police d'État": null,
    "O Matador": null
  }
}

欢迎任何建议!.EDD

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2021-07-24 15:29:12

我发现了错误:

代码语言:javascript
代码运行次数:0
运行
复制
$.ajax({
    type: 'GET',
    url: '/search.php',
    data: 'search=' + encodeURIComponent(search),
    success: function (datas) {

我没有设置dataType ...

dataType:"json",

像这样

代码语言:javascript
代码运行次数:0
运行
复制
$.ajax({
    type: 'GET',
    dataType:"json",
    url: '/search.php',
    data: 'search=' + encodeURIComponent(search),
    success: function (datas) {

但一切都能正常工作。

在Jquery上查找自动完成_renderItem不起作用

票数 0
EN

Stack Overflow用户

发布于 2021-07-22 16:57:49

你的PHP代码返回了一个带有'data‘参数的json对象,也许你可以试试

代码语言:javascript
代码运行次数:0
运行
复制
   if (datas !== "") {
      $('#searchOnAPI').autocomplete(datas.data);
   }
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/68466944

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档