在 Kendo UI 上处理 Java Servlet 异常

Question

我想在我的 Kendo UI 网格中显示一些日期。数据来自 java servlet。发生错误时，我将状态代码设置为 500。我可以在控制台上看到错误，但无法在 js 中处理。我想向用户显示一些消息，例如 'Update fail because of xxx' 或其他内容。这是我阅读的代码：（始终 returns 状态 500 用于测试。）

private void read(HttpServletRequest request, HttpServletResponse response) {
    try {
        DBOperations db = new DBOperations();
        Gson _gson = new Gson();
        Calendar cal = Calendar.getInstance();
        SimpleDateFormat sdf = new SimpleDateFormat("dd-MM-yyyy hh:mm:ss");
        System.out.println("Read called @" + sdf.format(cal.getTime())
                + " | p_callback: " + request.getParameter("callback"));
        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");
        response.setStatus(500);// For testing. Always return error!!!
        response.getWriter().println(
                (request.getParameter("callback") == null ? "callback"
                        : request.getParameter("callback"))
                        + "("
                        + _gson.toJson(db.getTrucksInPort()) + ")");
    } catch (Exception e) {
        e.printStackTrace();
    }
}

这是我的 js。参加 html:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Kendo UI - Grid Example</title>
        <link href="styles/examples-offline.css" rel="stylesheet">
        <link href="styles/kendo.common.min.css" rel="stylesheet">
        <link href="styles/kendo.rtl.min.css" rel="stylesheet">
        <link href="styles/kendo.default.min.css" rel="stylesheet">
        <link href="styles/kendo.dataviz.min.css" rel="stylesheet">
        <link href="styles/kendo.dataviz.default.min.css" rel="stylesheet">
        <script src="js/jquery.min.js"></script>
        <script src="js/kendo.all.min.js"></script>
        <script src="js/console.js"></script>
    </head>
    <body>
        <div id="example">
            <div id="grid"></div>

            <script>

                                $(document).ready(function () {
                                    var crudServiceBaseUrl = "http://localhost:8080/ws/api",
                                        dataSource = new kendo.data.DataSource({
                                            transport: {
                                                read:  {
                                                    url: crudServiceBaseUrl + "/ask",
                                                    dataType: "jsonp"
                                                },
                                                update: {
                                                    url: crudServiceBaseUrl + "/ask/Update",
                                                    dataType: "jsonp"
                                                },
                                                destroy: {
                                                    url: crudServiceBaseUrl + "/ask/Destroy",
                                                    dataType: "jsonp"
                                                },
                                                create: {
                                                    url: crudServiceBaseUrl + "/ask/Create",
                                                    dataType: "jsonp"
                                                },
                                                parameterMap: function(options, operation) {
                                                    if (operation !== "read" && options.models) {
                                                        return {models: kendo.stringify(options.models)};
                                                    }
                                                }
                                            },
                                            batch: true,
                                            pageSize: 20,
                                            schema: {
                                                model: {
                                                    id: "rowid",
                                                    fields: {
                                                        hn: { editable: true, nullable: false },
                                                        tn: { validation: { required: true } },
                                                        gid: { type: "date", validation: { required: true, min: 1} },
                                                        gign: { type: "number" },
                                                        sgid: { type: "date" },
                                                        dgii: { type: "number"}
                                                    }
                                                }
                                                ,errors:"Errors"
                                                
                                            },
                                            error:function(e){
                                                alert("Failed!.");
                                                this.cancelChanges();
                                                }
                                            
                                        });
                
                                    $("#grid").kendoGrid({
                                        dataSource: dataSource,
                                        pageable: true,
                                        height: 550,
                                        toolbar: ["create"],
                                         sortable: {
                                            mode: "single",
                                            allowUnsort: false
                                        },
                                        columns: [                           
                                            { field:"hn", title: "Haulier No" },          
                                            { field: "tn", title:"Trailer No", format: "{0:c}" },
                                            { field: "gid", title:"Gate In Date",format:"{0:MM-dd-yyyy HH:mm:ss}",editor: dateTimeEditor },
                                            { field: "gign", title:"Gate In Gate No" },
                                            { field: "sgid", title:"Second Gate In Date" ,format:"{0:MM-dd-yyyy HH:mm:ss}"},
                                            { field: "dgii", title:"Dummy Gate In" },
                                            { command: ["edit", "destroy"], title: "&nbsp;" }],
                                        editable: "popup"
                                    });
                                });
                                function dateTimeEditor(container, options) {
                    $('<input data-text-field="' + options.field + '" data-value-field="' + options.field + '" data-bind="value:' + options.field + '" data-format="' + options.format + '"/>')
                            .appendTo(container)
                            .kendoDateTimePicker({});
                
                }
            </script>
        </div>
    </body>
</html>

在此代码块中，我尝试向屏幕写入一些消息，但没有任何反应。

,errors:"Errors"

                                        },
                                        error:function(e){
                                            alert("Failed!.");
                                            this.cancelChanges();
                                            }

我哪里错了？谢谢。

Answer 1

我发现我哪里错了

Kendo UI 从响应 JSON 捕获错误（ 不是来自状态 ）。所以我 return 这个 Json String

{ "Errors": "This error message" }

错误标记必须与您的 js 代码相同 错误："Errors"

使用这段代码，我可以在屏幕上显示服务器消息

error:function(e){
alert("This is error message.\n"+e.errors);
}

在 Kendo UI 上处理 Java Servlet 异常

Handling Java Servlet Exception on Kendo UI

javascript

java

kendo-ui

telerik

kendo-ui-grid