json - select2 搜索 json 结果不起作用

Question

几个小时以来，我一直在寻找这个问题的答案，但没有找到与我的案例相关的任何内容。

我的设置:我创建了一个带有 WordPress 主题弹出窗口的自定义 TinyMCE 按钮，允许用户从下拉列表中选择自定义帖子类型帖子(在本例中为“客户评论”)，然后将其 ID 插入短代码中。由于该主题将运行的网站有超过 1,000 条评论，我认为最好对下拉列表的数据进行 json 编码，然后使用 select2 搜索有限结果列表(分页结果)并保留整个内容从炸毁。除了 2 个项目外，所有这些都运行成功:

1. 显示了 json 编码数据，但是当我输入搜索词时，select2 下拉列表显示了所有评论的列表，其中第一个被选中。它没有找到结果，即使搜索的文本在列表中

2. 从上面开始，一旦我输入一个搜索词，select2 就会向我显示所有结果，而不仅仅是 10 个或我设置的任何限制。

以下是我如何对数据进行 json 编码(在名为 bpl_content.php 的文件中):

$args       = array('post_type' => 'customer_reviews', 'posts_per_page' => -1, 'fields' => 'ids');
$posts      = get_posts($args);

if( $posts ) :

    $reviews = array();

    foreach( $posts as $post ) : setup_postdata( $post );

        $title  = get_the_title();
        $the_ID = get_the_ID();

        $reviews[] = array (
            'id'    => $the_ID,
            'text'  => $title
        );

    endforeach;

endif;

echo json_encode( $reviews )

返回

[{"id":12286,"text":"John Doe"},{"id":12285,"text":"Jane Doe"},...]

(返回了800多件，所以上面只显示了2件，但你明白了)

这是我用来让我的 菜单填充 json 数据的 javascript: $(".js-data-example-ajax").select2({ placeholder: "Select a Review", ajax: { url: "_bpl_content/bpl_content.php", type: 'POST', params: { contentType: 'application/json; charset=utf-8' }, dataType: 'json', delay: 250, data: function (term, page) { return JSON.stringify({ q: term, page_limit: 10 }); }, processResults: function (data) { return { results: data }; }, cache: true }, minimumInputLength: 3});除了搜索和分页之外，我无法弄清楚为什么一切正常。有什么想法吗？ 最佳答案 您的服务器端代码中似乎没有任何用于过滤和分页结果的代码。 Select2 意识到在服务器端完成此操作效率更高，并希望开发人员在服务器端实现它。搜索词将作为 q 传递，页面将作为 page(如果可用)传递。如果您不想在服务器端实现搜索和分页，或者只有一个返回所有 结果的端点，您仍然可以解决它。您只需使用 JSON 结果作为 data 初始化 Select2，而不是使用 AJAX 功能。 $.ajax({ url: "_bpl_content/bpl_content.php", type: 'POST', contentType: 'application/json; charset=utf-8'}).then(function (response) { $(".js-data-example-ajax").select2({ placeholder: "Select a Review", minimumInputLength: 3, data: response }); }); 关于json - select2 搜索 json 结果不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31573324/ 上一篇：Haskell concat Int 下一篇：xml - 如何将 xml 转换为 docx？ 相关文章： javascript - 选择 2 : Disable case-sensitive matches json - 在 kotlin 中分支 json 解析的惯用方式 php - WordPress cURL 和 wp_remote_post javascript - 如何使用 HTML 5's localstorage with Jquery' s select2 插件 javascript - 无限滚动选择2组 php - WordPress 数据库内存错误 javascript - 无论如何，是否可以在数据映射内执行 if 语句？ javascript - NodeJS : Write a js object to file and do exports Java GSON编码/解码复杂的类结构 javascript - 使用普通的 javascript/jquery 在数组中创建对象 ©2023 IT工具网  联系我们