如何使用POST API在搜索中使用Kendo UI在多选择上使用Kendo UI

发布于 2025-02-08 02:46:54 字数 3944 浏览 1 评论 0原文

我在多选中添加了Kendo UI,并使用Post API根据搜索来获取数据。 这是我尝试实现它的代码。

var searchx = ""
var ds = new kendo.data.DataSource({
    transport: {
        read: {
            url : "https://searchapi/list",
            type: 'POST',
            data: function (params) {
                console.log("1");
                var searchTerm = params.term && params.term != "" ? params.term : searchx;
                var query = {
                                         "txt": [
                                                              {
                                                                   "txt: "Level4",
                                                                    "values": [
                                                                               "1819"
                                                                              ]
                                                              },
                                                              {
                                                                   "txt": "Level3",
                                                                   "values": []
                                                              },
                                                              {
                                                                   "txt": "Level2",
                                                                    "values": []
                                                              },
                                                              {
                                                                   "txt": "Leve1",
                                                                   "values": [
                                                                              "278"
                                                                             ]
                                                              }
                                                           ],
                                           "xyz": [
                                                              {
                                                                  "dt": "2022-04-24",
                                                                  "field": "startDate"
                                                              },
                                                              {
                                                                  "dt": "2022-05-24",
                                                                  "field": "endDate"
                                                              }
                                                           ],
                                            "sorts": [],
                                            "limit": 50,
                                            "q": searchTerm
                }
                searchx = searchTerm;                
                console.log("2");
                console.log(JSON.stringify(query));
                return JSON.stringify(query);
                //return Json(ds, JsonRequestBehavior.AllowGet);
            },
            contentType: 'application/json',
            dataType: 'json',
            success: function(data){
            },
            datatype: "json",
            beforeSend: function (xhr) {
                console.log('beforeSend');
                xhr.setRequestHeader('Authorization','Bearer @Session.AuthToken~');
            }
        }
    },
    serverFiltering: true,
   serverSorting: true,
   placeholder: "Select One..."
});
$("#Tasks").kendoMultiSelect({
        placeholder: "Select Tasks...",
         filter: "contains",
        autoBind: false,
    dataValueField: "objectId",
    dataTextField : "title",
    dataSource : ds
});

自动完成 /打字机搜索。我已经通过使用Kendo创建了一个多选择控件。多选行动不起作用,任何人都可以帮助我解决这个问题

I have added Kendo UI on multi-select and use Post API to fetch the data on the basis of the search.
Here is the code in which I have tried to implement it.

var searchx = ""
var ds = new kendo.data.DataSource({
    transport: {
        read: {
            url : "https://searchapi/list",
            type: 'POST',
            data: function (params) {
                console.log("1");
                var searchTerm = params.term && params.term != "" ? params.term : searchx;
                var query = {
                                         "txt": [
                                                              {
                                                                   "txt: "Level4",
                                                                    "values": [
                                                                               "1819"
                                                                              ]
                                                              },
                                                              {
                                                                   "txt": "Level3",
                                                                   "values": []
                                                              },
                                                              {
                                                                   "txt": "Level2",
                                                                    "values": []
                                                              },
                                                              {
                                                                   "txt": "Leve1",
                                                                   "values": [
                                                                              "278"
                                                                             ]
                                                              }
                                                           ],
                                           "xyz": [
                                                              {
                                                                  "dt": "2022-04-24",
                                                                  "field": "startDate"
                                                              },
                                                              {
                                                                  "dt": "2022-05-24",
                                                                  "field": "endDate"
                                                              }
                                                           ],
                                            "sorts": [],
                                            "limit": 50,
                                            "q": searchTerm
                }
                searchx = searchTerm;                
                console.log("2");
                console.log(JSON.stringify(query));
                return JSON.stringify(query);
                //return Json(ds, JsonRequestBehavior.AllowGet);
            },
            contentType: 'application/json',
            dataType: 'json',
            success: function(data){
            },
            datatype: "json",
            beforeSend: function (xhr) {
                console.log('beforeSend');
                xhr.setRequestHeader('Authorization','Bearer @Session.AuthToken~');
            }
        }
    },
    serverFiltering: true,
   serverSorting: true,
   placeholder: "Select One..."
});
$("#Tasks").kendoMultiSelect({
        placeholder: "Select Tasks...",
         filter: "contains",
        autoBind: false,
    dataValueField: "objectId",
    dataTextField : "title",
    dataSource : ds
});

Autocomplete / Typeahead search . I have created a Multi-select control by using kendo.The Multi-Select is not working Can anybody can help me with this

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文