level51/silverstripe-ajax-select-field

使用vue.js的Silverstripe Ajax选择字段

安装: 980

依赖: 0

建议者: 0

安全: 0

星标: 2

关注者: 4

分支: 4

开放问题: 0

类型:silverstripe-vendormodule

0.5.1 2024-02-26 00:00 UTC

This package is auto-updated.

Last update: 2024-08-26 18:54:49 UTC


README

此模块为Ajax端点返回的结果添加了AjaxSelectFieldAjaxMultiSelectField

结果检索

结果可以从自定义端点(使用setEndpoint(ENDPOINT_URL)方法)或通过传递给字段的回调函数(使用setSearchCallback)检索(见下例)。

响应必须是包含每个结果的JSON对象数组的JSON数组,每个结果都必须至少有一个idtitle字段,例如

[
    {
        "id": 1,
        "title": "Home"
    },
    {
        "id": 2,
        "title": "Contact Us"
    }
]

存储

单选(AjaxSelectField)

默认情况下,整个结果(包括所有属性)将作为JSON字符串存储在数据库中,尽管也存在“仅id”模式。

因此,数据库值将类似于{ "id": "1", "title": "Home" },其中idOnlyMode = false。激活该模式后,将仅存储id(与默认下拉字段相同)。

多选(AjaxMultiSelectField)

结果将存储为包含所选项ID的JSON数组,例如["1", "2"]

方法/选项

setEndpoint(string)

通过传递整个URL设置自定义搜索端点。

setSearchCallback(callable)

传递一个在每次搜索请求时执行的回调函数。使用字段类中定义的search方法。

setMinSearchChars(int)

更改搜索执行所需字符的数量(默认为3)。

setPlaceholder(string)

更改输入字段的默认占位符文本。

setGetVars(array)

设置要添加到每个请求中的自定义GET变量列表。格式必须为["key" => "value"]。

setSearchHeaders(array)

设置与每个搜索请求一起发送的自定义请求头列表。格式必须为["key" => "value"]。

setIdOnlyMode(bool) [仅单选]

启用/禁用idOnlyMode。如果启用,字段将仅存储所选结果的“id”。否则,将存储完整的结果有效负载。

请注意,搜索端点或回调必须支持带有?id参数的请求,如果该模式处于活动状态,则返回仅该一个结果。

setDisplayFields(array) [仅多选]

定义要显示的所选项字段列表,基本上是表格列。默认为idtitle

enableSorting / disableSorting [仅多选]

启用/禁用按显示字段对所选项进行排序的能力。

安装

composer require level51/silverstripe-ajax-select-field

用法示例

单选

AjaxSelectField::create('MyField', 'My Field Label')
    ->setSearchCallback(
        function ($query, $request) {
            // This part is only required if the idOnlyMode is active
            if ($id = $request->getVar('id')) {
                $page = SiteTree::get()->byID($id);
                return [
                    'id' => $page->ID,
                    'title' => $page->Title
                ];
            }

            $results = [];
            foreach (SiteTree::get()->filter('Title:PartialMatch', $query) as $page) {
                $results[] = [ 'id' => $page->ID, 'title' => $page->Title ];
            }

            return $results;
    })

多选

AjaxMultiSelectField::create('MyField', 'My Field Label')
    ->setSearchCallback(
        function ($query, $request) {
            // Return detail info for the selected ids on load
            if ($ids = $request->getVar('ids')) {
                foreach (SiteTree::get()->filter('ID', $ids) as $page) {
                    return [
                        'id' => $page->ID,
                        'title' => $page->Title,
                        'urlSegment' => $page->URLSegment // example of a custom field, see also below
                    ];
                }
            }
            $results = [];
            foreach (SiteTree::get()->filter('Title:PartialMatch', $query) as $page) {
                $results[] = [ 'id' => $page->ID, 'title' => $page->Title, 'urlSegment' => $page->URLSegment ];
            }

            return $results;
    })->setDisplayFields([ 'title' => 'Custom Label', 'urlSegment' => 'URL' ])

要求

  • SilverStripe ^4 | ^5
  • PHP >=7.1
  • ext-json

维护者