Questions on Kendo UI for jQuery Forum

0 answers

990 views

Why my foreach (var item in ViewBag.ReportResult) in $("#grid").kendoGrid did not display?

Im trying to display a kendo.grid after clicking submit. I attached a screenshot so you can understand what Im trying to do.

After filling in the information and click submit, I want the information to be displayed below but unfortunately nothing change after I click submit. Only the content in else is displayed

This is my code in view

<script>
$(document).ready(function () {
    $("#form").kendoForm({
        validatable: { validationSummary: true },
        orientation: "horizontal",
        formData: ...,
        items: ...,
        submit: function (ev) {
            $.ajax({
                type: "POST",
                url: RootUrl+"Issue/ReportIssue",
            });
        }
    });
    $("#grid").kendoGrid({
        dataSource: {
            data: [
                @if (ViewBag.ReportResult != null)
                {
                    foreach (var item in ViewBag.ReportResult)
                     {
                        @: { col1: '@item.ISSUE_NUM', col2: '@item.PRIORITY', col3: '@item.MODULE', col4: '@item.DESCRIPTION', col5: '@item.REPORTED_DATE', col6: '@item.ISSUE_RESOLUTION', col7: '@item.RESPOND_DATE', col8: '@item.ACTION_TAKEN', col9: '@item.RESOLVED_DATE', col10: '@item.STATUS' },
                     }
                } else
                {
        
                        @: { col1: 'fdfd', col2: 'fd', col3: 're', col4: 'gf', col5: 'hg', col6: 'hy', col7: 'hg', col8: 'jh', col9: 'yt', col10: 'hg' },
                }
            ],
            pageSize: 10
        },
        sortable: true,
        pageable: ...,
        groupable: true,
        filterable: true,
        // columnMenu: true,
        reorderable: true,
        resizable: true,
        selectable: "multiple, row",
        columns: ...
    });
});

Here is my controller. I commented a line in the sql statement(line 24 from bottom). Just ignore that as I dont want to carry two problems at the same time.

[HttpGet]
    public ActionResult ReportIssue()
    {
        if (Session["User_Name"] == null)
            return RedirectToAction("Login", "Account");
        else
        {
            ViewBag.ValidationErrorMsg = "";
            ViewBag.ReportResult = null;
            

            SetUserViewBag();

            return View();
        }
    }

    [HttpPost]
    public ActionResult ReportIssue(string application, string environment, string DateFrom, string DateTo)
    {
        if (Session["User_Name"] == null)
            return RedirectToAction("Login", "Account");
        else
        {
            ViewBag.ValidationErrorMsg = "";
            string get_report_issue = "select " +
                "i.ISSUE_NUM, " +
                "i.PRIORITY, " +
                "i.MODULE, " +
                "CONCAT(i.TITLE, CHAR(13), CHAR(10), i.DESCRIPTION) AS DESCRIPTION, " +
                "CONVERT(VARCHAR(20), i.CREATED_DATE, 103)AS REPORTED_DATE, " + //dd / mm / yyyy 
                "CONCAT(i.ISSUE_TYPE, CHAR(13), CHAR(10), i.ISSUE_CATEGORY, CHAR(13), CHAR(10), i.ISSUE_RESOLUTION) as ISSUE_RESOLUTION, " +
                "CONVERT(VARCHAR(20), " +
                    "( " +
                    "select " +
                        "min(MODIFIED_DATE) " +
                    "from NEPS.dbo.WEBGIS_ISSUE_LOG " +
                    "where " +
                        "i.issue_num = issue_num " +
                        "and FIELD = 'STATUS' " +
                        "and OLD_VALUE = 'NEW'),103 " +
                    ") as RESPOND_DATE, " + //dd / mm / yyyy 
                "STUFF( " +
                    "( " +
                    "SELECT " +
                        "',' + a.NEW_VALUE " +
                    "FROM NEPS.dbo.WEBGIS_ISSUE_LOG a " +
                    "WHERE " +
                        "a.ISSUE_NUM = i.ISSUE_NUM " +
                    "ORDER BY " +
                        "a.NEW_VALUE FOR XML PATH('')), 1, LEN(','), CHAR(13) " +
                    ") AS ACTION_TAKEN, " +
                "CONVERT(VARCHAR(20), ISNULL( " +
                        "( " +
                        "select "  +
                            "max(MODIFIED_DATE) " +
                        "from NEPS.dbo.WEBGIS_ISSUE_LOG " +
                        "where " +
                            "i.issue_num = issue_num " +
                        "and FIELD = 'STATUS' " +
                        "and NEW_VALUE = 'RESOLVED' " +
                        "), " +
                        "( " +
                        "select " +
                            "max(MODIFIED_DATE) " +
                        "from NEPS.dbo.WEBGIS_ISSUE_LOG " +
                        "where " +
                            "i.issue_num = issue_num " +
                        "and FIELD = 'STATUS' " +
                        "and NEW_VALUE = 'CLOSED' " +
                        ") " +
                    ") , 103) AS RESOLVED_DATE, " +
                "i.STATUS " +
            "FROM NEPS.dbo.WEBGIS_ISSUE i " + 
            "LEFT JOIN NEPS.dbo.WEBGIS_ISSUE_LOG C " + 
                "ON i.ISSUE_NUM = C.ISSUE_NUM " +
            "where " +
                "(C.FIELD = 'REMARKS' or C.FIELD = 'STATUS') " +
                //"AND(C.MODIFIED_DATE between " + Convert.ToDateTime(DateFrom).ToString() + " and " + Convert.ToDateTime(DateTo).ToString() + ") " +
                "AND(i.APPLICATION = '" + application + "' OR 'ALL' = '" + application + "' ) " +
                "AND(i.ENVIRONMENT = '" + environment + "' OR 'ALL' = '" + environment + "' ) " +
            "group by " +
                "i.ISSUE_NUM, " +
                "i.PRIORITY, " +
                "i.MODULE, " +
                "i.TITLE, " +
                "i.DESCRIPTION, " +
                "i.CREATED_DATE, " +
                "i.ISSUE_TYPE, " +
                "i.ISSUE_CATEGORY, " +
                "i.ISSUE_RESOLUTION, " +
                "i.STATUS";

            var listReportIssue= db.Database.SqlQuery<ReportIssue>(get_report_issue).ToList();

            return Json(new
            {
                Success = true,
                ListData = listReportIssue
            }, JsonRequestBehavior.AllowGet);
        }
    }

Can you suggest me a solution?

Data Source

Grid

asked on 28 Dec 2021

1 answer

615 views

[Solved] Sanitize data from server before rendering widget - xss

Hi,

I have following situation:

We have desktop application and web application with angularJS and Kendo UI jquery which both use same server REST API.

If user enters malicious code as string <script>alert("security breach")</script> through desktop application or manually through postman and API, this is saved to the database (we have cases where we have to allow such tags in db). When this is rendered on desktop, it is fine, but when I render Kendo UI tree list - script is rendered and executed. So, my tree list is displayed, and alert is executed.

I have ngSanitize turned on application wide, but it seems not to be working on kendo ui widgets used within (we combine jquery and angular approach for widgets).

Do you have any suggestions how to approach to this?

Thank you

General Discussions

Security

answered on 28 Dec 2021

1 answer

251 views

Broken ARIA reference on grid page footer

Hello, I'm using some kendo grids in my application. i need to make them WCAG 2.1 AA compliant.

I use the wave plugin for chrome to see if there are any WCAG errors and its reporting that I have broken aria references on my grid page footer.

this is only happening on some grids so i believe its a setting to do with the grid or the page footer.

this also happens on your basic demo of the grid

https://demos.telerik.com/kendo-ui/grid/basic-usage

but not the grid overview

https://demos.telerik.com/kendo-ui/grid/index

thanks in advance

Jack

Grid

answered on 28 Dec 2021

1 answer

221 views

The identified library jquery, version 1.12.4 is vulnerable.

owasp reports vulnerability to the jquery version you ship together with components, any plans to switch to the upper version?

General Discussions

answered on 28 Dec 2021

1 answer

973 views

Kendo grid get selected row foreign key column values

I have a grid with foreign key columns

columns.ForeignKey(c => c.LanguageID, (System.Collections.IEnumerable)ViewData["languages"], "Id", "Description").Title("Language").Width(200);

I want to get the text value of the foreign key drop down value ie: English in this case for selected rows.

I can Iterate selected rows and get the dataItem

       grid.select().each(function () {

            var dataItem = grid.dataItem($(this));
            console.log(dataItem);
        
        });

which gets me the Id

is there an easy way to read the description?

Thanks

Grid

answered on 27 Dec 2021

1 answer

111 views

First item of category/series position of line chart

Dear sirs, I can't get a result.

As you can see, the first value for (01.01.2021) is located in the middle of first step.

Can you help me guess please, how should I configure the chart to bring the 01.01.2021 with it's value (0) right to the zero level of X line?

I'd like the chart values move left in a half of the cell step.

Charts

answered on 24 Dec 2021

0 answers

190 views

File or directory not found error while uploading file

Greetings. I am getting the following error while uploading a file with Kendo upload. Code works fine at local. But it gives this error on the server.

Error:

Client-Side Code:

$("#batchFile").kendoUpload({
async: {
saveUrl: '/DijitalArsiv/UploadFile/',
autoUpload: false
},
upload: function (e) {

if (uploadFileNode.isMainFolder) {
realPath = realPath + "\\" + personelID
}

e.data = { "id": uploadFileNode.id, "path": realPath, "isMainFolder": uploadFileNode.isMainFolder, "type": uploadFileNode.spriteCssClass };

},
select: function (e) {

if (e.files.length != 0) {
$.each(e.files,function (index, value) {

var filtredValue = acceptedFileTypes.filter(x => x == value.extension)
if (filtredValue.length == 0) {
e.preventDefault();
$("#message-alert").html("Sadece '.pdf', '.jpg', '.png', '.jpeg', '.docx', '.xlsx' türünde dosyalar yükelenebilir. Lütfen yüklediğiniz dosyların türünü kontrol edin.")
kendoWindowMessageAlertModal.data("kendoWindow").content($("#message-alert").html()).center().open();
}
})
}
},
success: function (e) {

if (e.response.Status) {
getTreeView().append([{ id: e.response.ID, text: e.response.FileName, spriteCssClass: e.response.Type, UnicParentCode: nodeToUploadParent.UnicParentCode, isDraggable: true, isDroppable: true, hasChildren: false, isEditable: false, isMainFolder: false }], nodeToUpload)
updateBackupTree();
} else {
e.preventDefault();
}
},
multiple: true,
batch: true,
localization: {
cancel: "İptal",
dropFilesHere: "Dosyalarınızı Buraya Sürükleyebilirsiniz!",
remove: "Sil",
retry: "Tekrar Dene!",
select: "Dosya Seç",
statusFailed: "Yükleme Başarısız!",
statusUploaded: "Yükleme Başarılı!",
statusUploading: "Yükleniyor...",
uploadSelectedFiles: "Yükle"
}
});

Server-side Code:

[HttpPost]
public JsonResult UploadFile(HttpPostedFileBase batchFile, int? id, string path, bool isMainFolder,string type)
{

}

Upload

asked on 23 Dec 2021

1 answer

1.1K+ views

How to download file in browser from physical path

Hello, I'm currently working on a project for my company and ive encountered a problem. I dont know why I cant download the file attachment. ive attached a jpg file of the screenshot for you to see. There is a file attachment named sad kermit(2).jpg and a message in the console in the screenshot

This is my kendo form code in view.

$("#form").kendoForm({
            validatable: { validationSummary: true },
            orientation: "horizontal",
            formData: {
                ID: "@Model.ID",
                IssueNumber: "@Model.ISSUE_NUM",
                Title: "@Model.TITLE",
                Environment: "@Model.ENVIRONMENT",
                Application: "@Model.APPLICATION",
                Module: "@Model.MODULE",
                Priority: "@Model.PRIORITY",
                Status: "@Model.STATUS",
                FID: "@Model.FID",
                Jobname: "@Model.JOBNAME",
                Username: "@Model.USERNAME",
                MantisNumber: "@Model.MANTIS_NO",
                ModifiedBy: "@ViewBag.User_Name",
                Upload: "",
                ModifiedDate: "@Model.MODIFIED_DATE",
                Description: "@Model.DESCRIPTION",
                IssueType: "@Model.ISSUE_TYPE",
                IssueCategory: "@Model.ISSUE_CATEGORY",
                IssueResolution: "@Model.ISSUE_RESOLUTION",
                Remarks: "@Model.REMARKS",
                AssignedTo: "@Model.ASSIGNED_TO",
                CreatedBy: "@ViewBag.User_Name"
            },
            items: [{
                type: "group",
                label: "Edit Issue Details",
                items: [
                    ...,
                   ...,
                    ...,
                    ...,
                    ...,
                   ...,
                    ...,
                    ...,
                    ...,
                    ...,
                    ...,
                    {
                        field: "Upload",
                        label: "Upload File:",
                        editor: function (container, options) {
                            $("<input name='files' id='files' type='file' aria-label='files' />").appendTo(container).kendoUpload({
                                async: {
                                    saveUrl: '@Url.Action("UploadFiles", "Issue")',
                                    removeUrl: '@Url.Action("RemoveFiles", "Issue")',
                                    autoUpload: true
                                },
                                files: uploads
                            });
                        }
                    },
                    ...,
                    ...,
                    ...,
                    ...,
                    ...,
                    ...,
                    ...,
                    ...,
                ]
                }],
                submit: function (ev)...
            });

this is the code I use to try to download the file attachment in the same view but it isnt working I guess

$(".k-file").click(function (e) {
                var filename = $(this).find(".k-file-name").html();

                $.ajax({
                    type: "POST",
                    data: { "name": filename },
                    url: "/Issue/DownloadFile",
                    success: function (res) {
                        if (res.Success) {
                            console.log(res.DownloadUrl);
                            window.open(res.DownloadUrl, '_blank');
                        }
                    }
                });
            });

this is the controller

[HttpPost]
        public ActionResult DownloadFile(string name)
        {
            var folderName = Session["IssueNum"] as string;

            string fileDirectory = Path.Combine(System.Web.HttpContext.Current.Request.PhysicalApplicationPath, "App_Data", folderName, name);

            return Json(new
            {
                Success = true,
                DownloadUrl = fileDirectory
            }, JsonRequestBehavior.AllowGet);
        }

Could you suggest me a solution? Thank you

Upload

answered on 22 Dec 2021

6 answers

1.5K+ views

How to display array data in column?

One of my TreeList field is an array. For example:

var localData = [
{ id: 1, name: "A Team", description: "", players: ["a","b"], parentId: null },
{ id: 2, name: "Team Lead", description: "", players: ["c"], parentId: 1 }
];

The "players" field is an array. I configure the column like:

columns: [
{ field: "name", title: "Team", width: "350px" },
{ field: "description", title: "Description", width: "350px" },
{
title: "Players",
template: '{{ dataItem.players }}'
}]

However, the "Players" column shows like

["a","b"]

I expect it as

a, b

How do I fix it?

Thanks,

TreeList