Telerik Forums
Kendo UI for jQuery Forum
22 answers
1.6K+ views
Hi, 

I am planning to customize the Kendo UI upload control in my application. 

The user can select the multiple files ( up to 20) and currently the only the first file in the selected list is shown clearly and all other selected files are not shown completely. 

I want to change this behavior and customize a bit like i would like to show all the selected files one by one in each row and also the size of that the textarea ( where the file names are shown) should change with the length of the file name. 

I am using synchronous mode of upload.

How can we do this ?
Dimo
Telerik team
 answered on 12 Feb 2014
1 answer
78 views
We have a 4 level treeview. Since I know to get all the data from the 4th level will be time consuming, I want to click the 3rd level tree node, then get the data of 4th level and populate the nodes.  To get the data for 4th level when click the 4rd node is fine, but how can I let the new nodes appear without refreshing the whole treeview? 
Thanks for help.
tiffany
Top achievements
Rank 1
 answered on 11 Feb 2014
1 answer
95 views
Hi,

Can anyone help me on how to solve this issue?  I was able to see the parent nodes but not the children.  

Json result:

[{"PartNo":"1KK-21BD","HasChild":true,"_items":[{"ChildPartNo":"9003"},{"ChildPartNo":"7043"},{"ChildPartNo":"4036"},{"ChildPartNo":"9023"},{"ChildPartNo":"9040"}]}]

Below is my code:

@(Html.Kendo().TreeView()
    .Name("treeview")
    .HtmlAttributes(new {@class="demo-section" })
    .LoadOnDemand(false)
    .DataTextField("PartNo")
    .DataSource(dataSource => dataSource
        .Read(read => read
            .Action("Search", "Home").Data("GetInfo")
        )
       
    )
)




 function btnSearch_click() {
   GetInfo();
 }


 function GetInfo() {
        
        $.ajax({
            type: "POST",
            dataType: "json",
            contentType: 'application/json; charset=utf-8',

            data: JSON.stringify({
                PartNo: $('#txtNo').val()
            }),
            url: "@Url.Action("Search", "Home")",

            success: function (result) {
                debugger;
                  var dataSource = new kendo.data.HierarchicalDataSource({
                    data: result,
                    schema: {
                        model: {
                            PartNo: 'PartNo',
                            children: '_items',
                            hasChildren: 'HasChild'
                        }
                    }
                });

                $("#treeview").data("kendoTreeView").dataSource.data(dataSource.options.data);
            }
        })




Thanks for your help!!
Kiril Nikolov
Telerik team
 answered on 11 Feb 2014
1 answer
107 views
Hello
Is it possible to have doughnut chart similar to gauge so only some angle of chart is visible (not 100%). Like e.g. 270 angle.

Kind Regards
Marcin
Iliana Dyankova
Telerik team
 answered on 11 Feb 2014
1 answer
131 views
I've actually extended the ComboBox and added some of my own fuunctionality tpo it. It's workign very well so far, but for one little slight annoyance.

I want to prevent the ComboBox from automatically making a selection when the text in the editable area matches exactly the stated value of the item. This has to do with CSS reasons mostly. Also, I've overwritten the arrow scrolling, so that when you press the down arrow it will focus the next element (adds k-state-focused), but it does not actually select the value until you either hit enter, or click on it. I've tried removing the "k-state-selected" class from the element, but that causes errors when I actually go to select an item with the mouse, in that it causes the "e.item" to not be defined and so I'm unable to perform any "select" actions based on the selected value.

Any suggestions?

Kiril Nikolov
Telerik team
 answered on 11 Feb 2014
2 answers
206 views
Hi ... relatively new to webdev ...

I'm trying to populate the treeview from an async remote data source

var tree = $('#treeview').kendoTreeView({   
        dataSource: getQueryData(),
        dataTextField: "Name",
        select: function (e) { 
         var id = this.dataItem(e.node).id;
         onChange(id);
        }

I need to retrieve the data then process it prior to setting the data source in order to add sprites. Thus far my solution is as follows

  function fetchData(cb) {
    var data = [];
    var ds = new kendo.data.DataSource({
      transport: {
        read: {
          url         : "http://localhost:57773/api/definitions",
          dataType    : "json"
        }
      }
    });

    ds.fetch(function () {
      data = cb(ds.data());              
    });      

    return data;
  };

  function addSprites (data) {
    for (var key in data) {
      if (key == "NodeType") {
       data.spriteCssClass = data.NodeType;
      }

      if (data[key] !== null && typeof(data[key])=="object") {
        addSprites(data[key]);
      }
    }
    return data
  };

  function getQueryData () {  

    var dataitems = fetchData(addSprites);
    
    var hds = new kendo.data.HierarchicalDataSource({
      data: dataitems,
      schema: {
        model: {
          id          : "Key",
          hasChildren : "HasChildren"          
        }
      }  
    });

    return hds;
  }; 

I am not quite sure how I should be architecting this since the hierarchical data set is returning prior to the completion of the async data retrieval and pre-processing of that data. I'd be grateful if someone could give me a steer as to how to do this "properly". If possible I'd like to avoid going synchronous.

Thx IA.

Simon
Alex Gyoshev
Telerik team
 answered on 11 Feb 2014
1 answer
208 views
Hi, is there any configuration to prevent Editor from converting Greek characters to html entities? For example, by default Editor converts "ΑΒΓ" to "ΑΒΓ". Any workarounds? BTW, I use the MVC wrapper.
Alex Gyoshev
Telerik team
 answered on 11 Feb 2014
7 answers
146 views
Hi,

I want to create an application that will work on browsers, tablets and smartphones. How do I start? is there anything special that I have to take into consideration from the beginning? I'm asking because I already created a browser application  infrastructure using the templateLoader example that I found in one of your tutorials, and I'm also working with your router and I'm not sure that I'm in the right direction...It looks good on browser but that are the things that I have to think about if I want my app to work on other devices as well?
Sebastian
Telerik team
 answered on 11 Feb 2014
7 answers
849 views
I've been beating this dead horse for the last 2 weeks, on and off and still can't figure it out.

This is my datasource js:

var myDS = new kendo.data.DataSource({
    transport: {
        read: {
            url: 'dataset.json'
            ,dataType: "jsonp"
            ,data: { select: "ID,NAME" }
        }
    },
    schema: {
        data: function(response) {
            return response.features;
        },
        model: {
            fields: {
                "properties.ID": { type: "number" },
                "properties.NAME": { type: "string" }
            },
        }
    }
});

This is my dropdownlist init:

$("#dropdown").kendoComboBox({
    placeholder: "...",
    autoBind: false,
    suggest: true,
    dataTextField: "properties.NAME",
    dataValueField: "properties.ID",
    dataSource: myDS
});

This is my datasource table:

ID  |  NAME
-------------
1   |   0,4
2   |   6
3   |   10
4   |   20
5   |   35
6   |   110
7   |   220
8   |   400

The error 'Object doesn't support property or method 'toLowerCase'' pops up when trying to init the ddl - because my textfield values are basically numbers (but set as string in model and database!!), which are treated as strings - if I check the return values of datasource in Firefox and Chrome i see that my return values are treated as strings. The same goes for IE10 and above, but IE9 and IE8 treat those values as numbers, even if I've set the name field as string in datasource.

I've tried everything, I even went through all of the return rows of dataset and converted all of the name values to string, but that didn't help either. Not only that - if i try to print the response.features to console i get undefined in ie8/ie9 (what?).

Can anyone help me?
Atanas Korchev
Telerik team
 answered on 11 Feb 2014
2 answers
150 views
Hi, im evaluating the Kendo Mobile UI with application framework to develop a hybrid app for Android and IOS.

Im using application Framework, separating classes using .js files.

The problem is that visual studio 2013 intellisense doesnt provide any help for class constructor (for example when i wrote new User() intellisense dont suggest the constructor parameters defined).

any idea?

/*
User = kendo.data.ObservableObject.extend({
    init: function(username,nombre,apellido,email){
        this.username = username;
    }
});
*/

EXAMPLE FILES:

app.js

var app = new kendo.mobile.Application($(document.body), {
    user : null,
    loginService: null,
    skin:'flat',
    transition: 'slide',
    initial :  "views/account/login.html",
    init: function () {
        this.loginService = new LoginService();
        if (this.loginService.loadLocalCredential())
            this.initial = 'views/home/index.html';
    }
});

login.js

LoginService = kendo.data.ObservableObject.extend({
    username: "",
    password: "",
    isLoggedIn: false,
    login: function () {
        var that = this;
        var url = 'http://url/Account/Login?username=' + this.username + '&password=' + this.password;
        $.ajax({
            url: url,
            dataType: "json",
            success: function (data, textStatus, jqXHR) {
                if (data.result == true) {
                          var user = new User(username,nombre,apellido,email); /* when i write new User() intellisense doesnt provide any help*/
                    that.set("isLoggedIn", true);
                    app.navigate("./views/home/index.html");
                }
            }
        });
    },
    logout: function () {
        this.clear();
        app.navigate('./views/home/index.html');
    },
    clear: function () {
        this.set('username', '');
        this.set('password', '');
        this.set('isLoggedIn', false);
    },
    loadLocalCredential: function () {
        this.set('username', 'geoorge');
        this.set('password', '1231');
        this.set('isLoggedIn', true);
         
    }
 
});


user.js

User = kendo.data.ObservableObject.extend({
    username: "",
    nombre: "",
    apellido: "",
    email: "",
    isLoggedIn: false,
    init: function(username,nombre,apellido,email){
        this.username = username; this.nombre = nombre; this.apellido = apellido; this.email = email;
    }
});


Thanks!
Kiril Nikolov
Telerik team
 answered on 11 Feb 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
MultiColumnComboBox
Chat
DateRangePicker
Dialog
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
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?