Telerik Forums
Kendo UI for jQuery Forum
0 answers
119 views

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();
        });

Eric
Top achievements
Rank 1
 asked on 16 Jun 2022
0 answers
107 views

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

brajesh
Top achievements
Rank 1
Iron
 asked on 16 Jun 2022
1 answer
520 views

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?

 

Georgi Denchev
Telerik team
 answered on 15 Jun 2022
1 answer
212 views
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
Neli
Telerik team
 answered on 15 Jun 2022
1 answer
141 views
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

Neli
Telerik team
 answered on 15 Jun 2022
1 answer
149 views
Good evening,
 
Yes, I'm struggling with the telerik captcha implementation in IE 10 , 

Am getting "SCRIPT5007: Unable to get property 'options' of undefined or null reference On kendo.all.min.js (25,35564)" 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
Neli
Telerik team
 answered on 15 Jun 2022
1 answer
235 views

1.I want to set multiple sheet tab name every sheet tab name have a different columns and I want this when click on another tab than that data show 

2. how to set validation for model  from json file. Json file also contain sequence of column based on that file column should show is it possible?

3.I'm doing validation like this please check zip file

It's too lengthy code how to handle if dynamically any changes on column please help me to solve out this problem

I have Json file like this please check another zip file.I have a multiple json file i want when i click on sheet tab name than that json file columns and data show

Martin
Telerik team
 answered on 15 Jun 2022
12 answers
36.5K+ views
Hi,

I want to pass an additional parameter to my Read ajax method from Grid along with currently passing the controller name and method name.

Currently I have something like below in my cshtml file:
.DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(5)
            .Model(model => model.Id(m => m.Id))
            .Create(create => create.Action("Create", controllerName))
            .Read(read => read.Action("Read", controllerName))
            .Update(update => update.Action("Update", controllerName))
            .Destroy(delete => delete.Action("Delete", controllerName))
        )
And my Action method is below:
public ActionResult Read([DataSourceRequest] DataSourceRequest request)
{}

Please can you show my how to pass addtional parameter (i.e Id) in Grid for Read operation and how to handle it in corresponding Controller?

Thanks,
Nirav
Dave Wolf
Top achievements
Rank 1
Iron
 answered on 14 Jun 2022
1 answer
353 views
Since I've updated to the latest version of kendo, a dropdown has appeared in my grids, next to the buttons to choose a page, that allows a user to choose a page. I would rather not have this dropdown. Is there any way to remove it?
Nikolay
Telerik team
 answered on 14 Jun 2022
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
Date/Time Pickers
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)
SPA
Filter
Drawer (Mobile)
Drawing API
Globalization
Gauges
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
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
OrgChart
TextBox
Effects
Accessibility
ScrollView
PivotGridV2
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Collapsible
Localization
MultiViewCalendar
Touch
Breadcrumb
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
Popover
DockManager
FloatingActionButton
TaskBoard
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
+? more
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?