Telerik Forums
Kendo UI for jQuery Forum
3 answers
518 views
Hi,

      How to set the width of kendo Scheduler Add/Edit Popup window ?
Dimiter Madjarov
Telerik team
 answered on 26 Oct 2015
1 answer
195 views

Hi,

I have a grid in batch edit mode. ​The grid is using a local data source. It has a custom template for a command button which becomes visible if the row's data item is dirty. This is working fine. My problem is I'd like to roll-back that data item to its initial state when the button is clicked regardless of whether the row is in edit mode or not. 

This is the event that fires when the undo button is clicked.

var theGrid = $("#layersGrid").data("kendoGrid");
        theGrid.table.on('click', '.undo-button', function (e) {
            setToInitialState.call(theGrid, e);
        });​

  function setToInitialState(e) {
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    }

How do I revert the data item to its initial state ?

Thank you.

Kiril Nikolov
Telerik team
 answered on 26 Oct 2015
3 answers
93 views

Can the mobile listview scroll in place? without scrolling the view.

 

My specific example has a list view inside of the view footer.

Petyo
Telerik team
 answered on 26 Oct 2015
4 answers
322 views

Hi,

 I am new to Kendo and Telerik and I have been having a play to see if I can connect it to Unleashed (an inventory management application which I am evaluating).  In order to access the API, I have to pass some authorization parameters in the header.

I believe I have got this to work because I am not getting an authentication error, however I am getting the following error and I have tried a few different code changes and I have exhausted the google search results on the subject.

 The error I am getting is:  Uncaught TypeError: e.slice is not a function [kendo.all.min.js - line 11]

 Can anyone shed an light on why I am getting this error?

 

 

            <div class="demo-section k-content wide">
                <div id="listView"></div>
                <div id="pager" class="k-pager-wrap"></div>
            </div>

            <script type="text/x-kendo-template" id="custtemplate">
                <div class="cust">
                    <h3>#:CustomerName#</h3>
                </div>
            </script>

           <script>
            $(function () {
                //alert($("#lblCrypto").text);
                var dataSource = new kendo.data.DataSource({
                    transport: {
                        read: {
                            url: "https://api.unleashedsoftware.com/Customers",
                            headers: {
                                "Content-Type": "application/json",
                                "Accept": "application/json",
                                "api-auth-id": "​***********************",
                                "api-auth-signature": "************************"
                            },
                            dataType: "json"
                        }
                    },
                    pageSize: 21
                });

                $("#listView").kendoListView({
                    dataSource: dataSource,
                    template: kendo.template($("#custtemplate").html())
                });
            });
           </script>​

 

 

I have also tried adding this to the dataSource section, but it didnt make any difference

                            success: function (result) {
                                console.log(result);
                                var pass = result.data;
                                $("#listView").data("KendoGrid").data.data(pass);
                            }

 

Any help would be greatly appreciated.

Dave

Dave
Top achievements
Rank 1
 answered on 26 Oct 2015
1 answer
85 views

Hi,

I have a custom rule that check to see if a grid has any rows when a certain check is checked. The rule works correctly (that is it prevents submission if it is not met and allows if it is met), but the defined message is never added to the errors collection and therefore not displayed on screen. The other two custom rule /  messages work as intended and display correctly.

I am using the Q2 2015 professional version in an MVC 4 web app with bootstrap.

 

Here is the validator configuration, which is contained within a standard  jQuery 'document.ready' function:

01.jQuery("#HAForm").kendoValidator({
02.               rules: {
03.                   pupilSelected: function (input) {
04.                       if (input.is("#pupilSelector [type=checkbox]")) {
05.                           return jQuery("#pupilSelector input:checked").length > 0;
06.                       }
07. 
08.                       return true;
09.                   },
10.                   travelOptionSelected: function (input) {
11.                       if (input.is("#travelOptions [type=checkbox]")) {
12.                           return jQuery("#travelOptions input:checked").length > 0;
13.                       }
14. 
15.                       return true;
16.                   },
17.                   flightsAdded: function (input) {
18.                       if (input.is("#travelOptions input:checked[value='Flying']")) {
19.                           return jQuery("#flightGrid").data("kendoGrid").tbody.find('>tr').length > 0;
20.                       }
21. 
22.                       return true;
23.                   }
24.               },
25.               messages: {
26.                   pupilSelected: "You must choose at least one pupil.",
27.                   travelOptionSelected: "You must choose at least one travel option.",
28.                   flightsAdded: "You must add at least one flight."
29.               },
30.               validate: function () {
31.                   showErrors(this.errors());
32.               }
33.           });

 

And this is the code that displays the errors on screen:

01.function showErrors(errors) {
02.           var errorsContainer = jQuery("#errors");
03.           var html = "";
04. 
05.           for (var idx = 0; idx < errors.length; idx++) {
06.               html += "<li>" + errors[idx] + "</li>";
07.           }
08. 
09.           errorsContainer.empty().append(jQuery(html));
10.       }

 

I am at a loss as to why the first two messages display correctly but the 'flightsAdded' message is never displayed even when it is the only rule. 

Thanks

Chris

 

Rosen
Telerik team
 answered on 26 Oct 2015
1 answer
216 views
Are there any existing node operation (add/modify/delete) and Right-click Menu solutions in Kendo UI?
Alex Gyoshev
Telerik team
 answered on 26 Oct 2015
1 answer
245 views

Hi.

I have a json array that I want to use with autocomplete in order to display a template like in this demo:

http://demos.telerik.com/kendo-ui/autocomplete/template

 

 I have a working and a non-working version of a simple autocomplete in the following jsfiddle.

http://jsfiddle.net/cupnfkhq/​

 

My main problem is the second autocomplete that doesn't work (the one bound to usersData). I have a similar response from a server, in which it returns an array, but I can't seem to get the autocomplete to work. I want to eventually have a custom template for the autocomplete itself.

What am I doing wrong?

 

Thank you for your help.

Yoly
Top achievements
Rank 2
 answered on 25 Oct 2015
1 answer
1.4K+ views

My goal here is to be able to dynamically add and remove tabs.  I'd like to use a close icon on the tab to trigger the removal.  A special plus tab at the end would be used to add new tabs.  The jsfiddle below is my attempt to do this but I'm noticing the content is getting mixed with the tabs as they're being removed.  Can anyone help with what I'm doing wrong or perhaps suggest a better approach?  Thanks.

http://jsfiddle.net/kturner75/o0g4e5ct/
Kevin
Top achievements
Rank 1
 answered on 23 Oct 2015
4 answers
88 views

Hi

Small error in the kendo ui documentation for the grid properties, see the attached image

 

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columns.filterable.cell.suggestionOperator

 

 

Cheers

Lynden Garrett

Brett
Top achievements
Rank 1
 answered on 23 Oct 2015
2 answers
1.6K+ views

I realize that these forums are chock full of posts about this, and I have read most of them yet my problem remains.  I'm trying to use the most basic implementation of aggregates, and I keep getting the error 'sum is not defined' or as in my jsFiddle example 'count is not defined'. Could someone please take a look and tell me what I am doing wrong?

var rawData = {
    allData: [
        { employeeId: 1, departmentId: 2 },
        { employeeId: 2, departmentId: 1 },
        { employeeId: 3, departmentId: 3 },
        { employeeId: 4, departmentId: 2 }
    ],
    employees: [
        { value: 1, text: 'John Smith' },
        { value: 2, text: 'Jane Smith' },
        { value: 3, text: 'John Doe' },
        { value: 4, text: 'John White' },
    ],
    departments: [
        { value: 1, text: 'Dept A' },
        { value: 2, text: 'Dept B' },
        { value: 3, text: 'Dept C' },
    ]
};
 
var vm = {
    dsAllData: new kendo.data.DataSource({
        data: rawData.allData
    })
};
 
$(document).ready(function() {
    //kendo.bind($('#ui'), vm);
    $('#myGrid').kendoGrid({
        dataSource: vm.dsAllData,
        groupable: true,
        columns: [
            { field: 'employeeId', title: 'Employee',
             values: rawData.employees, width: 200 },
            { field: 'departmentId', title: 'Department',
             values: rawData.departments, width: 200,
             aggrigate: ['count'], groupFooterTemplate: 'Count: #= count #' }       
        ]
    });
});

Thanks, Jay

Jay
Top achievements
Rank 2
 answered on 23 Oct 2015
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
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
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
Licensing
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
+? more
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?