Telerik Forums
Kendo UI for jQuery Forum
5 answers
1.9K+ views
Hi, 

I can't figure it out why kendo-drop-down-list ng-change fired twice as configuration done as follows, 

//HTML
<select kendo-drop-down-list
ng-model="EditPriestSetting.settingYear"
k-data-text-field="'keyDate'"
k-data-value-field="'valueDate'"
k-data-source="addYears"
ng-change="GetEditPriestSettings(EditPriestSetting.settingYear)">
</select>

//script 
$scope.GetEditPriestSettings=function(selectedYear){
console.log($scope.EditPriestSettings);
if(selectedYear) {

angular.forEach($scope.EditPriestSettings, function (PriestSetting) {
if (parseInt(selectedYear) === parseInt(PriestSetting.Year)) {
$scope.EditPriestSetting = {
settingYear: PriestSetting.Year,
holiday: PriestSetting.HolidayDays,
seniorDays: PriestSetting.SeniorDays,
studyLeave: PriestSetting.StudyLeaveDays,
freeDays: PriestSetting.FreeDays,
redDays: PriestSetting.RedDays,
comment: PriestSetting.Comment

};

};
});

}
};

what am i missing here?





Dimiter Topalov
Telerik team
 answered on 06 Oct 2016
1 answer
313 views

I have a page that contains a dropdown that will drive the contents of my kendo grid.  When a button is clicked, I want to manually call my read function of my grid to get data from my MVC controller.  See below:

$("#engineButton").click(function () {
        $("#logGrid").data("kendoGrid").dataSource.options.transport.read.data.engineId = $("#stationaryEngine").val();
        $("#logGrid").data("kendoGrid").dataSource.read();
        $("#logGrid").show();
    });

My grid is set up as follows:

$("#logGrid").kendoGrid({
     dataSource: {
         transport: {
             read: {
                 url: "@Url.Action("StationaryEngineLogGrid_Read", "Engine")",
                 type: "get",
                 dataType: "json",
                 data: { engineId: 0 }
             },
             create: {
                 url: "@Url.Action("StationaryEngineLogPopup_Create", "Engine")",
                 type: "post",
                 dataType: "json"
             },
             update: {
                 url: "@Url.Action("StationaryEngineLogPopup_Update", "Engine")",
                 type: "post",
                 dataType: "json"
             },
             destroy: {
                 url: "@Url.Action("StationaryEngineLogPopup_Destroy", "Engine")",
                 type: "post",
                 dataType: "json"
             }
         },
         schema: {
             model: {
                 id: "Id",
                 fields: {
                     Id: {
                         type: "number",
                         editable: false
                     },
                     EngineId: {
                         type: "number",
                         editable: false
                     },
                     LogDate: {
                         type: "date",
                         parse: function (data) {
                             var d = new Date(data);
                             data = kendo.toString(new Date(d), "MM/dd/yyyy");
                         }
                     },
                     EngineHoursStart: {
                         type: "number",
                         validation: {
                             required: true
                         }
                     },
                     EngineHoursEnd: {
                         type: "number",
                         validation: {
                             required: true,
                             customValidation: function (input, params) {
                                 if (input.is("[name=engineHoursEnd]")) {
                                     var endHours = $(input).val();
                                     var startHours = input.closest(".k-edit-form-container").find("input[name=engineHoursStart]").val();
                                     if (endHours <= 0) {
                                         $(input).attr("data-customValidation-msg", "End Hours must be > 0.");
                                         return false;
                                     } else if (endHours <= startHours) {
                                         $(input).attr("data-customValidation-msg", "End Hours must be > Start Hours.");
                                         return false;
                                     }
                                 } else if (input.is("[name=engineHoursStart]")) {
                                     var startHours = $(input).val();
                                     var endHours = input.closest(".k-edit-form-container").find("input[name=engineHoursEnd]").val();
                                     if (startHours <= 0) {
                                         $(input).attr("data-customValidation-msg", "Start Hours must be > 0.");
                                         return false;
                                     } else if (startHours > endHours) {
                                         $(input).attr("data-customValidation-msg", "Start Hours must be < End Hours.");
                                         return false;
                                     }
                                 } else if (input.is("[name=logDate]")) {
                                     var date = $(input).data("kendoDatePicker").value();
                                     if (date > new Date()) {
                                         $(input).attr("data-customValidation-msg", "Date must be today or less.");
                                         return false;
                                     }
                                 }
                                 return true;
                             }
                         }
                     },
                     Hours: {
                         type: "number",
                         editable: false
                     },
                     RunningTotalHours: {
                         type: "number",
                         editable: false
                     },
                     EmergencyUse: {
                         type: "boolean"
                     },
                     MaintenanceUse: {
                         type: "boolean"
                     },
                     MonitorLight: {
                         type: "string"
                     },
                     Comments: {
                         type: "string"
                     }
                 }
             }
         },
         error: function (e) {
             if (e.errors) {
                 var message = "Errors:\n";
                 $.each(e.errors, function (key, value) {
                     if ('errors' in value) {
                         $.each(value.errors, function () {
                             message += this + "\n";
                         });
                     }
                 });
                 alert(message);
             }
         }
     },
     editable: {
         mode: "popup",
         template: $("#popup_editor").html()
     },
     edit: function (e) {
         var editWindow = this.editable.element.data("kendoWindow");
         editWindow.wrapper.css({ width: 600 });
         if (e.model.isNew()) {
             editWindow.title("Add new logging record");
             $("#EngineId").val($("#stationaryEngine").val());
             e.model.LogDate = "@DateTime.Now.Date.ToShortDateString()";
             e.model.EngineId = $("#stationaryEngine").val();
         } else {
             editWindow.title("Edit logging record");
         }
         $("#logDate").kendoDatePicker({
             format: "MM/dd/yyyy",
             parseFormats: ["MM-dd-yyyy", "MM/dd/yyyy"]
         });
         editWindow.center();
     },
     toolbar: [{ name: "create", text: "Add new logging record" }],
     columns: [
         { field: "Id", hidden: true },
         { field: "EngineId", hidden: true },
         { field: "LogDate", title: "Date", format: "{0: MM/dd/yyyy}" },
         { field: "EngineHoursStart", title: "Engine Hours Start" },
         { field: "EngineHoursEnd", title: "Engine Hours End" },
         { field: "EmergencyUse", title: "Emergency Use", template: "<input type='checkbox' #= EmergencyUse ? checked='checked':'' # />" },
         { field: "MaintenanceUse", title: "Maintenance Use", template: "<input type='checkbox' #= MaintenanceUse ? checked='checked':'' # />" },
         { field: "MonitorLight", title: "Monitor Light" },
         { field: "Comments", title: "Comments" },
         {
             command: [{
                 name: "edit",
                 text: {
                     update: "Save"
                 }
             },
             {
                 name: "destroy"
             }],
             title: "Actions"
         }
     ]
 });

Now, all of this works for my read function.  I hit my breakpoint in my controller.  Great.  However, when I do a Create, I have a date field inside my popup template that will not come across to my controller.  It's defined as follows:

<script id="popup_editor" type="text/x-kendo-template">
...
    <input type="text" name="logDate" data-type="date" data-bind="value:LogDate" data-role="datepicker" required />
...
</script>

Every time I submit the popup form, the date never comes across to my controller.  I read in other posts that you have to use a ParameterMap in your datasource, but if doing so, it messes up the read functionality.

Is there a way to accomplish both the read functionality and the create with my date being parsed correctly and passed to my controller?

Stefan
Telerik team
 answered on 06 Oct 2016
1 answer
99 views

Documentation for depth / start is wrong.

Quote:

"MONTH"
shows the days of the month
"YEAR"
shows the months of the year
"DECADE"
shows the years of the decade
"CENTURY"
shows the decades from the century

MONTH, YEAR, DECADE ... is not working, month, year, decade ... is.

Dimiter Topalov
Telerik team
 answered on 06 Oct 2016
2 answers
214 views

There are 2 different examples how to use confirm:

kendo.confirm("Are you sure that you want to proceed?").then(function () { //from online demos

kendo.confirm("Are you sure that you want to proceed?").done(function () { //from online documentation

But kendo.all.d.ts has:

function confirm(text: string): void;

which makes it impossible (without typecasting to any) for chaining (then/done). Same for prompt.

Vessy
Telerik team
 answered on 06 Oct 2016
1 answer
176 views

I have a grid declared as:

    columns: [
        { title: "", width: "55px", template: kendo.template($("#serviceActionsTemplate").html()) },
        { field: "serviceDate", title: "Service Date", type: "date", template: "#= kendo.toString(kendo.parseDate(serviceDate), '" + vm.dateFormat + "') #", width: "120px" },
        { field: "serviceType", title: "Service Type", width: "150px" },
        { field: "referenceNumber", title: "Ref Number", width: "100px" },
        { field: "odometer", title: "Odometer", type: "number", format: "{0:n0}", attributes:{style:"text-align:right;"}, width: "100px" },
        { field: "engineHours", title: "Engine Hrs", type: "number", format: "{0:n0}", attributes: { style: "text-align:right;" }, width: "100px" },
        { field: "totalCost", title: "Total Cost", type: "number", format: "{0:c2}", attributes: { style: "text-align:right;" }, aggregates: ["sum"], footerTemplate: "<div style='float: right'>#= kendo.toString(sum, 'c2') #</div>", width: "90px" },
        { field: "itemId", title: "ItemId", type: "number", width: "90px", hidden: true },
        { field: "serviceId", title: "ServiceId", type: "number", width: "90px", hidden: true }
    ],
    autoBind: false,
    dataSource: vm.serviceListGridData,
    editable: "inline",
    filterable: true,
    groupable: false,
    height: 400,
    navigatable: true,
    pageable: false,
    resizable: true,
    scrollable: true,
    sortable: { mode: "multiple" }
}

The html:

<md-tab label="Servicing">
    <md-content>
        <div id="vehicleServicingList" name="vehicleServicingList">
            <section class="page-bar">
                <md-button ng-click="vm.addServicing($event)" ng-disabled="!vm.security.allowCreateServicing" aria-label="Add Servicing">
                    <md-tooltip>Add New Servicing</md-tooltip>
                    <md-icon md-svg-icon="plus"></md-icon> Add
                </md-button>
                <md-button ng-click="vm.editServicing($event)" ng-disabled="vm.security.editLevelServicing < 1 || vm.selectedServices.length != 1" aria-label="Edit Servicing">
                    <md-tooltip>Edit Selected Servicing</md-tooltip>
                    <md-icon md-svg-icon="pencil"></md-icon>
                </md-button>
                <md-button ng-click="vm.removeMultipleServices($event)" ng-disabled="!vm.security.allowDeleteServicing || vm.selectedServices.length < 1" aria-label="Delete Selected Servicing">
                    <md-tooltip>Delete Selected Servicing</md-tooltip>
                    <md-icon md-svg-icon="delete"></md-icon>
                </md-button>
            </section>
 
            <kendo-grid id="serviceListGrid" name="serviceListGrid" options="vm.serviceListGridOptions" ></kendo-grid>
        </div>
    </md-content>
</md-tab>

When I attempt to click the checkbox in the first column the grid moves and then I try again and it moves again until it pushes the toolbar off the top.

Please see attached images of how it looks before the click on checkbox and after. The grid seems to push the tabs, toobar and column headers off the top.

Alexander Popov
Telerik team
 answered on 06 Oct 2016
1 answer
171 views

Kendo UI for JSP

Hi All,

How can i create dependency in kendo UI for JSP. for example. I have combo box with country names. I will select country names its respective states should get load in another combo box. please help me with this.

 

 

regards,

Irfan

Dimiter Topalov
Telerik team
 answered on 06 Oct 2016
7 answers
2.1K+ views
How to get the cells' value of the selected range? please give the example, thanks!
Alexander Popov
Telerik team
 answered on 06 Oct 2016
10 answers
398 views

Hello guys, 

Is there a way to change the visual marker to be on left on the line on the middle.

I have provided this dojo to better illustrate what i want to do.

Thank you very much.

Daniel
Telerik team
 answered on 06 Oct 2016
3 answers
217 views
Hello,
I'm trying to figure out why this behavior is changed on the last kendo release .. with no luck
The strange behavior that was working perfecly on kendo 2014.3.1411 and which is changed in vers. 2015.1.318
is the follow:

when I have a dropdown list in a popup edit mode which can be nullable and I manually change the value from the defaultValue to another value,
the first time the dropdown doesn't fire anything, all the other tiimes it fires correctly.

http://dojo.telerik.com/isECi

Eg.
click on New Record
change once "CategoryID" (doesn't fire)
chenge it once again (it fires)

with old versions

http://dojo.telerik.com/isECi/3
click on New Record
change once "CategoryID" (fires)

is this a bug ?
Thank you

Simone
Georgi Krustev
Telerik team
 answered on 06 Oct 2016
13 answers
2.3K+ views
Can someone please have a look at the code and screen shots below and see 
if you can give me some idea why the grid is blank after returning a valid collection
as part of a JsonResult?

Html.Kendo().Grid<AppointmentsDTO>().Name("FailedAppointments")                 .Columns(columns =>                 {                     columns.Bound(o => o.MemberFirstName).Title("Member First").Width(80);                     columns.Bound(o => o.MemberLastName).Title("Member Last").Width(80);                     columns.Bound(o => o.ClientMemberID).Title("ClientID").Width(60);                     columns.Bound(o => o.ProviderID).Title("ProviderID").Width(60);                     columns.Bound(o => o.ProviderFirstName).Title("Provider First").Width(80);                     columns.Bound(o => o.ProviderLastName).Title("Provider Last").Width(100);                     columns.Bound(o => o.AppointmentDate).Title("Appointment Date").Width(200);                     columns.Bound(o => o.IHAAppointmentID).Hidden(true);                 })                 .EnableCustomBinding(true)                 .AutoBind(true)                 .Pageable(page => page.Enabled(true).PageSizes(new Int32[] {20, 30, 50,100}))                 .Sortable(sorting => sorting.SortMode(Kendo.Mvc.UI.GridSortMode.SingleColumn))                 .Selectable()                 .Scrollable(scroll => scroll.Height(350))                 .DataSource(dataSource => dataSource                     .Ajax()                     .Read(read => read.Action("BindFailedAppointments""AppointmentScheduling")))





Daniel
Telerik team
 answered on 06 Oct 2016
Narrow your results
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
Drag and Drop
Application
Map
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
DropDownTree
ListBox
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
Styling
ColorPicker
Pager
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
Licensing
PivotGridV2
ScrollView
Switch
TextArea
BulletChart
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
TimePicker
FloatingActionButton
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
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
LLM Kit
+? more
Top users last month
Shiori
Top achievements
Rank 2
Iron
Tien
Top achievements
Rank 1
Iron
Robert
Top achievements
Rank 1
Rob
Top achievements
Rank 4
Bronze
Bronze
Iron
Geoff
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Shiori
Top achievements
Rank 2
Iron
Tien
Top achievements
Rank 1
Iron
Robert
Top achievements
Rank 1
Rob
Top achievements
Rank 4
Bronze
Bronze
Iron
Geoff
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?