如何筛选 JSON 页面向 Select2 提供数据？

Question

我正在尝试使用来自 t-sql 查询的数据填充 Select2 框。查询是 PHP 页面上的运行，它将输出转换为 JSON 并在主页的 javascript 中调用。

主页是这样的：

<?php
header('Content-type: text/html; charset=UTF-8');
require('db.php');      // Bring in the database connection
include("auth.php");    // Make sure the user is logged in to an account

?>

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1" http-equiv="Content Type" charset="utf-8"/>
    <!-- JQuery -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <!-- SELECT 2 -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
</head>

    <body style="background-color: #F5F5F5;">

        <select class="js-data-example-ajax">
        </select>

        <script>
        $('.js-data-example-ajax').select2({
            width: '250px',
            ajax: {
                url: 'http://10.1.248.41/TFM-Project/ImportINjson.php',
                dataType: 'json'
                // Additional AJAX parameters go here
          }
        });
        </script>
    </body>
</html>

我的 JSON 页面如下所示：

<?php
require('db.php');      // Bring in the database connection
include("auth.php");    // Make sure the user is logged in to an account

$search = $_GET['search'];

//JSON Table Stuff
$sql = "SELECT DISTINCT [IN] AS id, Nom as text
        FROM dbo.[TFM_NumérosIN2012]
        ;";

$stmt = sqlsrv_query($con,$sql);

$result = array();

do {
    while($row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC)) {
        $result[] = $row;
    }
} while (sqlsrv_next_result($stmt));

sqlsrv_free_stmt($stmt);

$data2 = json_encode($result);

echo '{ "results":' . $data2 . '}';

?>

JSON页面输出的数据如下所示：

{ "results":[{"id":2,"text":"SMITH Sean"},{"id":3,"text":"CHARLES charley"},{"id":4,"text":"TFC Madrid"},{"id":5,"text":"VAN DAMME jean claude"}]}

数据正在加载到 select 列表中，没有任何问题。但是，我尝试以多种方式过滤数据，但没有任何效果。我已经尝试添加数据参数并将搜索变量传递给 php/JSON 页面并在 $sql 变量中引用作为 where 子句，但这不会 return 任何东西

为了尝试过滤数据，我将 javascript 更改为：

$('.js-data-example-ajax').select2({
          width: '250px',
          ajax: {
            url: 'http://10.1.248.41/TFM-Project/ImportINjson.php',
            dataType: 'json',
            data: function (params) {
              var query = {
                search: params.term
              }

              // Query parameters will be ?search=[term]&type=public
              return query;
            }
          }
        });

但这打破了我的 select 并且它显示了一条消息 'The results could not be loaded.'

有人知道我做错了什么吗？

干杯，

Answer 1

在 php 文件的末尾，只需回显以下行：

 echo json_encode($result);

在您的 html/js 文件中：

<link href='https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js'></script>
<select name='js-data-example-ajax' class='js-data-example-ajax'></select>

$(document).ready(function()
{


$('.js-data-example-ajax').select2({
      placeholder: "Search for product",
      minimumInputLength: 1,
      width: '250px',
      ajax: {
        url: 'http://10.1.248.41/TFM-Project/ImportINjson.php',
        dataType: 'json',
        data: function (params) {
            var query = {
            search: params.term,
            type: 'public'
          }
          console.log("query : "+query.search);
          return query;
       },
       processResults: function (response) {
        console.log("response : "+response);
          return {
            results: $.map(response, function(obj) {
              console.log("response obj.id: "+obj.id);
              console.log("response obj.text: "+obj.text);
              return { id: obj.id, text: obj.text };
            })
        };
      },
       cache: false
     }
    });

});

如何筛选 JSON 页面向 Select2 提供数据？

How to filter a JSON page feeding data to Select2?

php

sql-server

jquery

json

jquery-select2