Telerik Forums
Kendo UI for jQuery Forum
or
Ask question
All Questions
Unanswered
Answered
28,665 questions
1 answer
92 views
Export PDF in different layout

Hi,

Is it possible to reformat the data being exported from the Grid?

Basically, I need to change the page layout from being a screen capture, as the PDF export does by default, to a different layout.

Think of a list of names, address, phones that is portrayed in a column layout instead of the row layout with columns that is the Grid default.

Column 1 would have, for example

Name1
Address1
City, state zip1
phone1

Name2
Address2
City, state zip2
phone2

Name3
Address3
City, State, Zip3
Phone3

 

Then, column 2 would have

Name4
Address4
City, State, Zip4
Phone4

And then continuing to the bottom of column2, then starting at the top of Column 3.

Is this possible with the Kendo UI PDF Export? Or maybe another function in the Kendo UI?

Thank you!

Grid
Georgi Denchev
Telerik team
 answered on 17 Jun 2022
0 answers
208 views
How to keep focus on same Kendowindow modal poup on Tab click

Hi Forum,

I have kendowindow opens as dialogue where we have two dropdown and two button (OK, Cancel)

once window loads focus on window and while tab click goes all fine till Cancel button, after that focus shift to browser

I wanted to keep focus on same window, Instead go to somewhere else in screen.

Below is piece of code snippet.

@(Html.Kendo().Window()
                                                .Name("AddressSelectionModal")
                                                .Modal(true)
                                                .Visible(false)
                                                .Width(350)
                                                .Animation(true)
                                                .Title("")
                                                .Actions(actions => actions.Clear())
                                                .Content(@<text>
                                                    @Html.Partial("~/Views/Shared/Modals/test.cshtml")
                                                </text>)

 

I was trying by write below code on cancel button "onblur" event but seems does not works.

 $("#AddressSelectionModal").data("kendoWindow").focus();

Please help on this how to keep focus on same kendowindow.

Thanks,

Santosh

General Discussions
View
Window
santosh
Top achievements
Rank 1
 asked on 17 Jun 2022
1 answer
564 views
Kendo upload error "An asynchronous module or handler completed while an asynchronous operation was still pending."

Hi..

When I upload file using kendo upload, it will hit the error event with response message "An asynchronous module or handler completed while an asynchronous operation was still pending.", but the file is successfully uploaded.

This only happen on the first time, subsequently is not getting the error anymore.


$("#files").kendoUpload({
	async: {
		saveUrl: "upload.aspx",
		removeUrl: "remove",
		autoUpload: true,
		allowmultiple: true,
		batch: true
	},
	localization: {
		select: "Select Files"
	},
	complete: onComplete,                
	error: function (e) {
		console.log(e);
	},
	select: function (e) {
		
	},
	dropZone: "#dropZoneElement",
	showFileList: false
});
Any idea of what is going on?
Upload
Martin
Telerik team
 answered on 17 Jun 2022
1 answer
1.9K+ views
Is Kendo UI for Jquery and angular is free or licenced ?

Is Kendo UI for Jquery and angular is free or licenced ?

If we get lincence will we be able to access all the compoenents

Accessibility
Neli
Telerik team
 answered on 17 Jun 2022
0 answers
140 views
Kendo viewmodel not binding to function

I am unable to bind a function to my Kendo viewmodel. It does not give an error message and simply does not bind even though other viewmodels on my page are working.


var Ccf;
(function (Ccf) {
    var ViewModels;
    (function (ViewModels) {
        var User;
        (function (User) {
            var defaultAddModel = {
                labelIds: []
            };
            var InfoViewModel = (function (_super) {
                __extends(InfoViewModel, _super);
                // parentViewModel must begin with an underscore, otherwise kendo will wrap it in an observable object.
                function InfoViewModel(_parentViewModel) {
                    _super.call(this);
                    this._parentViewModel = _parentViewModel;
                    this.data = new kendo.data.ObservableObject();
                    this.messages = new kendo.data.ObservableArray([]);
                    _super.prototype.init.call(this, this);
                }
                InfoViewModel.prototype.add = function (e) {
                    e.preventDefault();
                    if (!this._parentViewModel.addViewModel) {
                        // Initialize and bind the view model for the modal window.
                        this._parentViewModel.addViewModel = new AddViewModel(this._parentViewModel, defaultAddModel);
                        kendo.bind(this._parentViewModel.addModal, this._parentViewModel.addViewModel);
                    }
                    else {
                        this._parentViewModel.addViewModel.set("data", defaultAddModel);
                        this._parentViewModel.addViewModel.set("messages", []);
                    }
                    this._parentViewModel.addModal.modal("show");
                };
                InfoViewModel.prototype.destroy = function (e) {
                    var _this = this;
                    e.preventDefault();
                    if (confirm("Are you sure you want to delete the Note " + e.data.note + "?")) {
                        kendo.ui.progress(this._parentViewModel.container, true);
                        $.ajax({
                            url: Ccf.Utility.serviceUrl + "UserLabel/" + e.data.id,
                            method: "DELETE",
                            contentType: "application/json; charset=UTF-8",
                            dataType: "json"
                        })
                            .done(function (data, textStatus, jqXHR) {
                                // No need to hide the spinner. The refresh function will handle that.
                                _this._parentViewModel.refresh();
                            })
                            .fail(function (data, textStatus, errorThrown) {
                                toastr.error(Ccf.Utility.getAjaxMessages(data)[0], "Delete Failed");
                                kendo.ui.progress(_this._parentViewModel.container, false);
                            });
                    }
                };
                return InfoViewModel;
            }(kendo.data.ObservableObject));
            var AddViewModel = (function (_super) {
                __extends(AddViewModel, _super);
                // parentViewModel must begin with an underscore, otherwise kendo will wrap it in an observable object.
                function AddViewModel(_parentViewModel, data) {
                    _super.call(this);
                    this._parentViewModel = _parentViewModel;
                    this.data = data;
                    this.messages = new kendo.data.ObservableArray([]);
                    _super.prototype.init.call(this, this);
                }
                AddViewModel.prototype.save = function (e) {
                    var _this = this;
                    e.preventDefault();
                    var messages = [];
                    if (messages.length > 0) {
                        this.set("messages", messages);
                        return;
                    }
                    this.data.userId = this._parentViewModel.options.userId;
                    kendo.ui.progress(this._parentViewModel.addModal, true);
                    $.ajax({
                        url: Ccf.Utility.serviceUrl + "User/AddUserNote/",
                        method: "POST",
                        data: kendo.stringify(this.get("data")),
                        contentType: "application/json; charset=UTF-8",
                        dataType: "json"
                    })
                        .done(function (data, textStatus, jqXHR) {
                            _this._parentViewModel.refresh();
                            _this._parentViewModel.addModal.modal("hide");
                        })
                        .fail(function (data, textStatus, errorThrown) {
                            _this.set("messages", Ccf.Utility.getAjaxMessages(data));
                        })
                        .always(function (data, textStatus, errorThrown) {
                            kendo.ui.progress(_this._parentViewModel.addModal, false);
                        });
                };
                return AddViewModel;
            }(kendo.data.ObservableObject));
            var UserProfileNotesViewModel = (function () {
                function UserProfileNotesViewModel(options) {
                    this.options = options;
                    this.isInitialized = false;
                }
                UserProfileNotesViewModel.prototype.initialize = function () {
                    var _this = this;
                    if (!this.isInitialized) {
                        this.container = $("#user-profile-note-container");
                        this.addModal = $("#user-profile-entry-note-modal");
                        this.infoViewModel = new InfoViewModel(this);
                        this.refresh().then(function () { return _this.isInitialized = true; });
                    }
                };
                UserProfileNotesViewModel.prototype.refresh = function () {
                    var _this = this;
                    kendo.ui.progress(this.container, true);
                    return $.ajax({
                        url: Ccf.Utility.serviceUrl + "User/GetUserNotes/" + this.options.userId,
                        method: "POST",
                        contentType: "application/json; charset=UTF-8",
                        dataType: "json"
                    })
                        .done(function (data, textStatus, jqXHR) {
                            _this.infoViewModel.set("data", data);
                        })
                        .fail(function (data, textStatus, errorThrown) {
                            _this.infoViewModel.set("messages", Ccf.Utility.getAjaxMessages(data));
                        })
                        .always(function (data, textStatus, errorThrown) {
                            kendo.ui.progress(_this.container, false);
                            if (!_this.isInitialized) {
                                kendo.bind(_this.container, _this.infoViewModel);
                            }
                        });
                };
                return UserProfileNotesViewModel;
            }());
            User.UserProfileNotesViewModel = UserProfileNotesViewModel;
        })(User = ViewModels.User || (ViewModels.User = {}));
    })(ViewModels = Ccf.ViewModels || (Ccf.ViewModels = {}));
})(Ccf || (Ccf = {}));

 

The HTML that that binds to the viewmodel:


<div id="user-profile-note-entry-modal" class="modal fade" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title" data-bind="invisible: data.id">Add Child</h4>
                    <h4 class="modal-title" data-bind="visible: data.id">Update Child</h4>
                </div>

                <div class="modal-body">
                    @Html.Partial("_MessageListPartial")

                    <div class="form-group">
                        <label for="txtName">Name</label>
                        <input id="txtName" class="form-control" placeholder="" data-bind="value: data.name" />
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary" data-bind="click: save">Save</button>
                </div>
            </div>
        </div>
    </div>

<div class="user-profile-note-container">
        <div id="note-container" style="position: relative;">
            <div class="portlet">
                <div class="portlet-heading bg-primary">
                    <div class="portlet-widgets pull-left p-0">
                        <a data-toggle="collapse" data-parent="#notes" href="#notes-settings">
                            <i class="ion-minus-round pull-left m-t-10"></i>
                            <span class="divider"></span>
                            <span class="m-l-10 p-t-10">Associated Notes</span>
                        </a>
                    </div>
                    <div class="portlet-title pull-right">
                        <button type="button" class="btn btn-default waves-effect w-sm waves-light" data-bind="click: add">Add Note</button>
                        <span class="divider"></span>
                        <i class="ion-help-circled help-text-icon" data-container="body" title="" data-toggle="popover" data-placement="left" data-content="o	These are notes that can only be viewed by administrators and coordinators. Use this area to add information about a user." data-original-title="Associated Notes" aria-describedby="popover383606"></i>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div id="notes-settings" class="panel-collapse collapse in">
                    <div class="portlet-body" style="" data-bind="visible: messages.length <= 0">
                        <div id="bg-primary" class="panel-collapse collapse in">
                            <div class="portlet-body">
                                @foreach (User_Notes note in ViewBag.UserNotes)
                                {
                                    <div class="list-group-item">
                                        <div class="row">
                                            <div class="=conversation-text">
                                                <div class="ctext-wrap">
                                                    <div>
                                                        @note.NoteMessage
                                                    </div>
                                                    <small class="text-muted">by @note.EnteredByUserName - Entered at: @note.DateEntered </small>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                }
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>


 

    </div>


 

The page itself has several viewmodels being initialized and this is the only one that is having issues. The others are working fine with the same code structure and function calls. Here is where the viewmodels are being initialized: 

 


var Ccf;
(function (Ccf) {
    var ViewModels;
    (function (ViewModels) {
        var User;
        (function (User) {
            var UserProfileViewModel = (function () {
                function UserProfileViewModel(options) {
                    this.options = options;
                    this.infoViewModel = new User.UserProfileInfoViewModel(options);
                    this.childrenViewModel = new User.UserProfileChildrenViewModel(options);
                    this.diagnosisViewModel = new User.UserProfileDiagnosesViewModel(options);
                    this.labelViewModel = new User.UserProfileLabelsViewModel(options);
                    this.languageViewModel = new User.UserProfileLanguagesViewModel(options);
                    this.referralSourceViewModel = new User.UserProfileReferralSourceViewModel(options);
                    this.settingsViewModel = new User.UserSettingsViewModel(options);
                    this.notesViewModel = new User.UserProfileNotesViewModel(options);
                }
                UserProfileViewModel.prototype.initialize = function () {
                    this.infoViewModel.initialize();
                    this.childrenViewModel.initialize();
                    this.diagnosisViewModel.initialize();
                    this.labelViewModel.initialize();
                    this.languageViewModel.initialize();
                    this.referralSourceViewModel.initialize();
                    this.settingsViewModel.initialize();
                    this.notesViewModel.initialize();
                };
                return UserProfileViewModel;
            }());
            User.UserProfileViewModel = UserProfileViewModel;
        })(User = ViewModels.User || (ViewModels.User = {}));
    })(ViewModels = Ccf.ViewModels || (Ccf.ViewModels = {}));
})(Ccf || (Ccf = {}));

The user profile view model gets initialized directly on the view with the .Net razor passing the user Id value:


$(function () {
            var vm = new Ccf.ViewModels.User.UserProfileViewModel({ userId: "@ViewBag.UserId", isCoordinator: @isCoordinator.ToString().ToLower() });
            vm.initialize();
        });

Button
View
Eric
Top achievements
Rank 1
 asked on 16 Jun 2022
0 answers
119 views
Kendo Spreadsheet

Hello,

 

Can  i iterate this code through the loop in kendo spreadsheet

 sheet.range("AV2").formula("sum(AJ2:AU2)").background("#FFFF00").color("#ffffff");
    sheet.range("AV3").formula("sum(AJ3:AU3)").background("#FFFF00").color("#ffffff");
    sheet.range("AV4").formula("sum(AJ4:AU4)").background("#FFFF00").color("#ffffff");
    sheet.range("AV5").formula("sum(AJ5:AU5)").background("#FFFF00").color("#ffffff");
    sheet.range("AV6").formula("sum(AJ6:AU6)").background("#FFFF00").color("#ffffff");
    sheet.range("AV7").formula("sum(AJ7:AU7)").background("#FFFF00").color("#ffffff");
    sheet.range("AV8").formula("sum(AJ8:AU8)").background("#FFFF00").color("#ffffff");
    sheet.range("AV9").formula("sum(AJ9:AU9)").background("#FFFF00").color("#ffffff");
    sheet.range("AV10").formula("sum(AJ10:AU10)").background("#FFFF00").color("#ffffff");
    sheet.range("AV11").formula("sum(AJ11:AU11)").background("#FFFF00").color("#ffffff");
    sheet.range("AV12").formula("sum(AJ12:AU12)").background("#FFFF00").color("#ffffff");
    sheet.range("AV13").formula("sum(AJ13:AU13)").background("#FFFF00").color("#ffffff");
    sheet.range("AV14").formula("sum(AJ14:AU14)").background("#FFFF00").color("#ffffff");
    sheet.range("AV15").formula("sum(AJ15:AU15)").background("#FFFF00").color("#ffffff");
    sheet.range("AV16").formula("sum(AJ16:AU16)").background("#FFFF00").color("#ffffff");
    sheet.range("AV17").formula("sum(AJ17:AU17)").background("#FFFF00").color("#ffffff");
    sheet.range("AV18").formula("sum(AJ18:AU18)").background("#FFFF00").color("#ffffff");
    sheet.range("AV19").formula("sum(AJ19:AU19)").background("#FFFF00").color("#ffffff");
    sheet.range("AV20").formula("sum(AJ20:AU20)").background("#FFFF00").color("#ffffff");
    sheet.range("AV21").formula("sum(AJ21:AU21)").background("#FFFF00").color("#ffffff");
    sheet.range("AV22").formula("sum(AJ22:AU22)").background("#FFFF00").color("#ffffff");
    sheet.range("AV23").formula("sum(AJ23:AU23)").background("#FFFF00").color("#ffffff");

and what is the validate solution for this loop iterate based on row data available in spreadsheet

Spreadsheet
brajesh
Top achievements
Rank 1
Iron
 asked on 16 Jun 2022
1 answer
646 views
KendoUi Font icons are not loading
Actually we have kendoUi in angularjs project. which ic giving error in developer console like server not responding 404 error for webcomponentsicon.ttf and webcomponentsicon.woff. because of this icons are not loading. can anyone please help me to clear this issue
ActionSheet
Application
AutoComplete
Button
Button (Mobile)
ButtonGroup
Calendar
Charts
ColorPicker
ComboBox
Data Source
DatePicker
Diagram
Drag and Drop
Drawer (Mobile)
Drawing API
DropDownList
DropDownTree
Editor
FileManager
Filter
Form
Gantt
General Discussions
Globalization
Grid
Hierarchical Data Source
LinearGauge
ListBox
ListView
ListView (Mobile)
Map
MaskedTextBox
Menu
ModalView
MultiSelect
MVVM
NavBar
Notification
NumericTextBox
PanelBar
PDFViewer
PivotGrid
PopOver (Mobile)
Scheduler
ScrollView (Mobile)
Slider
Sortable
SPA
Sparkline
Splitter
SplitView
Spreadsheet
Switch (Mobile)
TabStrip
TabStrip (Mobile)
Templates
TileLayout
Toolbar
ToolTip
TreeList
TreeMap
TreeView
Upload
Validation
View
Window
Neli
Telerik team
 answered on 15 Jun 2022
1 answer
536 views
Text area gaining multiple inner sections

I have a grid with an edit button which opens a modal window

Inside that modal window I have a text area

Each time I set the value, it indents

$("#mytextarea").kendoTextArea().data('kendoTextArea').value("A new comment here");

It starts to do this which each successive setting of the value.

<span class="k-input k-textarea k-input-solid k-input-md k-rounded-md" style="width: 100%;">
<span class="k-input k-textarea !k-overflow-y-auto k-input-inner k-input-solid k-input-md k-rounded-md" style="width: 100%; resize: none;">
<span class="k-input k-textarea !k-overflow-y-auto k-input-inner k-input-solid k-input-md k-rounded-md" style="width: 100%; resize: none;">
<span class="k-input k-textarea !k-overflow-y-auto k-input-inner k-input-solid k-input-md k-rounded-md" style="width: 100%; resize: none;">
<textarea id="setup-deliverymethod-dialog-comments-textarea" style="width: 100%; resize: none;" data-role="textarea" aria-disabled="false" rows="1" placeholder="Comments" class="!k-overflow-y-auto k-input-inner" autocomplete="off"></textarea>
</span>
</span>
</span>
</span>

Am I setting the textarea value incorrectly?

 

TextArea
Georgi Denchev
Telerik team
 answered on 15 Jun 2022
1 answer
230 views
Tabstrip loading indicator
Hey guys,

I miss the loading indicator on top of each tab while loading content with ajax.
Latest version 2022.2.510.

It's easy to reproduce since the offical demo doesn't show the indicator as well.

(https://demos.telerik.com/kendo-ui/tabstrip/ajax -> Chrome Dev-Tools -> fake slow connection)

Any tricks?

Thank you!

Peter
TabStrip
Neli
Telerik team
 answered on 15 Jun 2022
1 answer
158 views
Kendo Jquery Captcha error in IE 10
Good evening,
 
Yes, I'm struggling with the telerik captcha implementation in IE 10 , 

am getting below error,

Even your demo site is also giving the same error.

Not sure how to fix this , can you please help me on this or redirect who can help me

Captcha
Neli
Telerik team
 answered on 15 Jun 2022
Narrow your results
Done
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Dialog
Chat
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
+? more
Top users last month
Edmond
Top achievements
Rank 1
Iron
fabrizio
Top achievements
Rank 2
Iron
Veteran
RobMarz
Top achievements
Rank 2
Iron
Fakhrul
Top achievements
Rank 1
Iron
Tejas
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Learn how
122 123
124
125 126
Top users last month
Edmond
Top achievements
Rank 1
Iron
fabrizio
Top achievements
Rank 2
Iron
Veteran
RobMarz
Top achievements
Rank 2
Iron
Fakhrul
Top achievements
Rank 1
Iron
Tejas
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Learn how
Want to show your ninja superpower to fellow developers?
Learn how