Telerik Forums
Kendo UI for jQuery Forum
6 answers
248 views
see fiddle http://jsfiddle.net/A2URt/

the kendo chart does not seem to handle very small values well. We included two examples one with very small values, the other one with a bit larger values. The edge case seems to lie in values 1.0e-7.

Can somebody help, explain etc?

Kind regards Dennis
JamesD
Top achievements
Rank 1
 answered on 09 Jan 2014
4 answers
370 views
Hello,
I have a need to cancel a checkbox check if the user has reached a limit. Unfortunately, simply calling preventDefault isn't working when the checked item is a parent. So I whipped up a little jQuery to handle this for me --

$("#treeview").on("click", ":checkbox", function (e) {
    var treeView = $("#treeview").data("kendoTreeView");
    origChecked = listChecked;
    listChecked = [];
    checkedNodeIds(treeView.dataSource.view(), listChecked);
     
    if (searchLimited && listChecked.length > searchLimit) {
        var newChecked = $(listChecked).not(origChecked).get();
        $.each(newChecked, function (index, value) {
            var item = treeView.dataSource.get(value);
            item.set("checked", false);
        });
 
        e.preventDefault();
        listChecked = origChecked;
    }
});
 
// function that gathers IDs of checked nodes
function checkedNodeIds(nodes, checkedNodes) {
    for (var i = 0; i < nodes.length; i++) {
        if (nodes[i].checked) {
            if (nodes[i].id != "0") {
                checkedNodes.push(nodes[i].id);
            }
        }
 
        if (nodes[i].hasChildren) {
            checkedNodeIds(nodes[i].children.view(), checkedNodes);
        }
    }
}


I can see this works fine. If I put a breakpoint at the end, the treeview looks perfect. However, it appears that some other internal kendo event is firing after and resetting the items to a checked state. As I understood things, calling the set method should have been updating the underlying data for the treeview, so I didn't expect my changes to be overwritten... What am I missing? 

Thanks,
Phil
Alexander Popov
Telerik team
 answered on 09 Jan 2014
4 answers
100 views
I am using the build-in icons all over my app which works fine when deploying the app in debug mode (build settings). But when I build the app in release mode non of the build-in icons is shown.

I am forcing the flat theme for the app.
Steve
Telerik team
 answered on 09 Jan 2014
1 answer
153 views
Hi

I am trying to format number to IP format like 192.168.1.1 or 192.168.001.001

$("#ip4").kendoNumericTextBox({
  format: "IP ###.###.###.###", /* works only if you input exact 12 numbers, works only if dot is thousand separator */
  decimals: 0
});

This is not the right way!
I was searching kendo forum for text mask format but no luck. Does defining mask exists in kendo ?

Thx

By Ales
Kiril Nikolov
Telerik team
 answered on 09 Jan 2014
2 answers
118 views
Following the advice in several forum posts, along with this jsbin created by Alexander Valchev, I am investigating the use of an observable object that provides HTML content to be rendered:
jsbin.com/iyakig/2/edit
If I add a second button to the code in the jsbin like this:
 makeButton: function () {
                var html = '<a data-role="button" data-bind="click: makeListView">Replace again</a><a data-role="button" data-bind="click: makeListView">Replace yet again</a>';
                this.set("foo", html);
            },

The second button does not get initialized as a widget as you can see here:
jsbin.com/iyakig/31/edit 
Is there a limitation on MVVM binding of HTML code?

We have been using kendo.mobile.init() to initialize all widgets in the HTML generated by a template, but we are looking to use MVVM binding as suggested in this post.  We would be very interested in knowing why additional widgets are not initialized as well as the advantages to this approach vs. the kendo.mobile.init() approach.


Randy
Top achievements
Rank 1
 answered on 09 Jan 2014
1 answer
73 views


I was looking at the code of Kendo Chart to find out how the points (for line chart) are plotted from a single dataItem. While researching I found out that you are using a Box2D method from where you are creating a property which contains (x1,y1, x2, y2) and with this property you are plotting the points with there average values.

I  was unable to found out that from where you are retrieving these values (x1,y1,x2,y2).   If you can please show me the path (function) from where you are converting these values then it will help me to find a solution.

Thanks.
Hristo Germanov
Telerik team
 answered on 09 Jan 2014
1 answer
68 views
Hello,
i tried to use kendo ui slider in a mobile site.

It seems to work ... 

Is there anyway to show the ticks in a mobile site ? 
It only can show the tickts on a desktop browser.

Regards

Jürgen
Kiril Nikolov
Telerik team
 answered on 09 Jan 2014
3 answers
1.0K+ views
I'm using a grid in an MVVM environment. The grid that starts out with now rows. Once the Add New Row button is clicked the grid adds a row but the user can keep clicking the button and add new rows without any validation on existing rows. How can I either disable the New Row button, perform validation on the current row before adding a new row or client side validate all rows before trying to update to the server. I don't care if a user wants to add several rows and then edit the columns before saving the changes back to the server but I need to validate all required fields first.

 
Alexander Popov
Telerik team
 answered on 09 Jan 2014
1 answer
301 views
Hello,

We are currently working on a kendo web project where we need to be able to have a button on a grid that opens a kendo modal window and then creates a custom viewmodel to be consumed by the current kendo window that can be passed into another kendo window.  However, I can't seem to find a way to bind a ViewModel into the kendo window.  Any help would be appreciated.  Here is my code:

The problems that I know about are:
  • I don't know where to bind the observable to the window.
  • How to pass the same observable from window to window.
Thanks,

Colin
<!DOCTYPE html>
<html>
    <head>
        <link href="bootstrap.min.css" rel="stylesheet"/>
        <link href="kendo.common.min.css" rel="stylesheet" />
        <link href="kendo.bootstrap.min.css" rel="stylesheet" />
        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript" src="kendo.all.min.js"></script>
        <script type="text/javascript" src="bootstrap.min.js"></script>
         
    </head>
    <body>
        <div id="gridModal"></div>
        <div id="transaction"></div>
    </body>
</html>
 
<script type="text/x-kendo-template" id="template">
    <div>
        <div>
            <div>
            Current Transaction Fee
            </div>
            <div>
                <input id="locationFeeAmount" data-bind="value: locationFee">
            </div>
            <a id="toModal2" type="button" class="k-button k-button-icontext" onclick="showSecondModal();">To Modal 2</a>
        </div>
    </div>
</script>
 
<script type="text/x-kendo-template" id="modal2">
    <div>
        <div>
            <div>
            Cuurent Transaction Fee:
            </div>
            <div>
                <input value=#=locationFee #>
            </div>
            <button class="k-button" id"toModal2"></button>
        </div>
    </div>
</script>
<script>
$(function () {
        var locationFeeAdjustments = [{
        "CustomerName": "Fred Flinstone",
        "CustomerNumber": 123456234,
        "CustomerTransactionNumber": 2323423456789,
        "RepName": "Bugs Bunny",
        "CustomerBill": 34454.55,
        "locationFee": 89.22,
        "testField": "Bugs"},
        {"CustomerName": "Joe Smith",
        "CustomerNumber": 123434456,
        "CustomerTransactionNumber": 23456234556789,
        "RepName": "Jack Smith",
        "CustomerBill": 34454.55,
        "locationFee": 89.22,
        "testField": "Jack"
    }];
 
    $("#gridModal").kendoGrid({
        dataSource:{
            data: locationFeeAdjustments,
            schema: {
                model: {
                    id: "Id",
                    fields: {
                        CustomerName: { type: "string"},
                        CustomerNumber: { type: "number"},
                        CustomerTransactionNumber: { type: "number"},
                        RepName: { type: "string"},
                        CustomerBill: { type: "string"},
                        locationFee: { type: "string"}
                        
                    }
                }
            }
        },
        pageable: true,
        height: 430,
        toolbar: ["create"],
        columns: [
            { field: "CustomerName", title: "Customer Name"},
            { field: "CustomerNumber", title: "Customer Number"},
            { field: "CustomerTransactionNumber", title: "Customer Transaction Number"},
            { field: "RepName", title: "Officer Name"},
            { field: "CustomerBill", title: "Bill Due"},
            { field: "locationFee", title: "Location Fee"},
            { command: {text: "Waive Location Fee", click: showTransactionModal}}],
        editable: "inline",
        save: function () {
            this.refresh();
        }
    });
 
    wnd = $("#transaction")
        .kendoWindow({
            title: "Transaction Fee",
            modal: true,
            visible: false,
            resizable: false,
            width: 300
        }).data("kendoWindow");
 
    detailsTemplate = kendo.template($("#template").html());
 
    function showTransactionModal(e) {
        e.preventDefault();
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
 
        kendoWindowViewModel = setViewModel(dataItem);
        wnd.content(detailsTemplate(kendoWindowViewModel));
        console.log(kendoWindowViewModel);
        wnd.center().open();
    };
 
});
 
function setViewModel(dataItem){
    var kendoWindowViewModel = kendo.observable({
    CustomerName: dataItem.CustomerName,
    CustomerNumber: dataItem.CustomerNumber,
    CustomerTransactionNumber: dataItem.CustomerTransactionNumber,
    CustomerBill: dataItem.CustomerBill,
    locationFee: dataItem.locationFee,
    Approver: "",
    AdjustmentAmount: ""});
 
    return kendoWindowViewModel;
}
 
 
 
function showSecondModal(){
    console.log('hit');
    console.log(kendoWindowViewModel);
     
}
</script>
Alexander Valchev
Telerik team
 answered on 09 Jan 2014
6 answers
399 views
We've built a Kendo UI grid report that works fine with Chrome, Firefox, Safari(windows), and IE11 using Windows 8.1 pro,
JQuery 1.9.1, and Kendo UI 2013.3.119.

There is a problem displaying the Grid using IE 11.0.2 with Windows 7, JQuery 1.9.1, and Kendo UI 2013.3.119.

Can you repeat this problem?  Any solutions to this problem?  
Kiril Nikolov
Telerik team
 answered on 09 Jan 2014
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
ScrollView
Switch
BulletChart
Licensing
QRCode
ResponsivePanel
TextArea
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
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
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?