<div id="fileManager"></div>
<script>
    var baseUrl = "https://demos.telerik.com/kendo-ui/service/filemanager/";

    $("#fileManager").kendoFileManager({
        messages: {
            toolbar: {
                createFolder: "New Folder",
                upload: "Upload",
                sortDirection: "Sort Direction",
                sortDirectionAsc: "Sort Direction Ascending",
                sortDirectionDesc: "Sort Direction Descending",
                sortField: "Sort By",
                nameField: "Name",
                sizeField: "File Size",
                typeField: "Type",
                dateModifiedField: "Date Modified",
                dateCreatedField: "Date Created",
                listView: "List View",
                gridView: "Grid View",
                search: "Search",
                details: "View Details",
                detailsChecked: "On",
                detailsUnchecked: "Off",
                "delete": "Delete",
                rename: "Rename"
            },
            views: {
                nameField: "Name",
                sizeField: "File Size",
                typeField: "Type",
                dateModifiedField: "Date Modified",
                dateCreatedField: "Date Created",
                items: "items"
            },
            dialogs: {
                upload: {
                    title: "Upload Files",
                    clear: "Clear List",
                    done: "Done"
                },
                moveConfirm: {
                    title: "Confirm",
                    content: "<p style='text-align: center;'>Do you want to move or copy?</p>",
                    okText: "Copy",
                    cancel: "Move",
                    close: "close"
                },
                deleteConfirm: {
                    title: "Confirm",
                    content: "<p style='text-align: center;'>Are you sure you want to delete the selected file(s)?</br>You cannot undo this action.</p>",
                    okText: "Delete",
                    cancel: "Cancel",
                    close: "close"
                },
                renamePrompt: {
                    title: "Prompt",
                    content: "<p style='text-align: center;'>Enter new name for the file.</p>",
                    okText: "Rename",
                    cancel: "Cancel",
                    close: "close"
                }
            },
            previewPane: {
                noFileSelected: "No File Selected",
                extension: "Type",
                size: "Size",
                created: "Date Created",
                createdUtc: "Date Created UTC",
                modified: "Date Modified",
                modifiedUtc: "Date Modified UTC",
                items: "items"
            }
        },
        dataSource: {
            transport: {
                read: {
                    type: "post",
                    url: baseUrl + "Read"
                }
            }
        }
    });
</script>