I just discovered KendoUI and saw its feature-set to be one of the best despite it being more expensive and lacking some widgets (compared to Wijmo, for example), and I'm looking forward to buying and using it for a Web app (soon) and an Adobe AIR app (next).

Does anybody have any experience, or recommendation, about which HTML5/CSS3 Responsive Web Design Framework works best with KendoUI Web?

Any opinions (or issues, gotchas, etc.) about using:

1. Twitter Bootstrap 2.0.2
2. Skeleton, or
3. some other responsive design framework

with KendoUI Web?

Thanks in advance for any feedback.

Hello,

if I want to add behaviour of the expand function, how can I do this.

function onExpand(e) {
    setTimeout(function(){ 
        $("input:first", e.item).focus();
    },1);
}

I always want this to happend when expand event is fired. Can I extend the panelBar to always have this function.
So I dont have to do it on all my pages.

Hi,

Strange one this. On my Galaxy Tab when I scroll the page, any switches that have been put into the OFF or NO state flick back to ON/YES while my finger is in the swipe motion. Also, the image of Eduardo disappears for the duration of the swipe too.

Steps to reproduce :

1) On a Galaxy Tab browse to http://www.captainsjob.com/test/kendouimobile/examples/mobile/switch/index.html 

2) Change any of the switches to the OFF position

3) Swipe the screen up and down

This doesn't happen on the Dolphin browser, it happens on the default browser with Gingerbread 2.3.3. This browser lets you move a page up and down even if the entire page content is 100% visible.

Fiddling about with the switches makes the previously change switch toggle back briefly too. Probably part of the same problem.

Thanks
Gareth

Hi,

On my Galaxy Tab (GT-P1000, Android 2.3.3) using the default browser when I switch between tabs and then swipe to scroll down there is brief flash of the previously selected tab before the selected tab is displayed again and the scroll starts.

Steps to reproduce :

1) On a Galaxy Tab (GT-P1000, Android 2.3.3) open http://www.captainsjob.com/test/kendouimobile/examples/mobile/tabstrip/index.html 
2) Select each tab in turn a few times
3) Start a swipe down motion
4) See the previously selected tab flash on screen then revert back to the tab you were on when you started the swipe

KendoUI Mobile is going to be brilliant for me saving me lots of time and getting my product out of the door quicker than if I learned titanium/mono/sencha. I'm sure these Android issues will be ironed out I'm happy to do testing on my two android devices (HTC Wildfire S and the Galaxy Tab).

Thanks
Gareth

I've implemented the autocomplete component successfully to search against a list of website urls. However when I submit my form i want to submit the numerical id value of the site not the text value. Is this possible?

$("#maintSiteId").kendoAutoComplete({
                minLength: 3,
                dataTextField: "site_url",
                dataValueField: "site_id", // this doesn't seem to work and is depreciated?
                filter: "contains",
                height: 320,
                dataSource: {
                    pageSize: 20,
                    transport: {
                        read: {
                            url: "/Sites/DataJsonSites.cshtml",
                            dataType: "json",
                            type: "GET"
                        },
                        parameterMap: function(options) {
                            return $.extend(options, {
                                id: '',
                                title: $("#maintSiteId").data("kendoAutoComplete").value()
                            });
                        }
                },
                placeholder: "Select site...",
                separator: ", ",
                suggest: true
                }
            });

Input field contained within standard <form>
<input class="span6" id="maintSiteId" name="maintSiteId" style="width: 320px; margin-left: 0;"/>

Sample JSON data being used;
[{"site_id":1,"site_url":"www.mysite1.com","site_name":"my site 1"},{"site_id":2,"site_url":"www.mysite2.com","site_name":"my site 2"}]

hi all, new to kendo, new to json. Can't seem to get any data into a kendo.data.DataSource. Am using the new 2012 q1 mobile release and ASP.NET MVC 3. Here's my code:

js:

    // create a template using the definition on the application page (the .cshtml file)
    var templateFundingSources = kendo.template($("#template-funding-sources").html());
 
    dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: "/Home/GetCardFundings", // the remove service url
                dataType: "json", // JSONP (JSON with padding) is required for cross-domain AJAX
 
                data: {
                    //additional parameters sent to the remote service
                    _cardId: cardID
                }
            }
        },
 
 
        schema: {
            data: "cardFunding",
            model: {
                id: "CardID",
                fields: {
                    CardID: {
                        type: "number",
                        nullable: false
                    },
                    RemainingBalance: {
                        type: "number"
                    }
                }
            }
        },
 
 
        change: function () { // subscribe to the CHANGE event of the data source
            $("#listview-card-fundings").html(kendo.render(templateFundingSources, this.view()));
        }
    });
 
 
    dataSource.read();

    //test data source to see it's defined 
    dataSource.add({ cardID: 4, remainingBalance: 34 });

and MVC code:

public JsonResult GetCardFundings(int _cardId)
        {
            List<CardFunding> cfs = new List<CardFunding>();
 
            CardFunding cf = new CardFunding();
            cf.CardID = 1;
            cf.RemainingBalance = 3;
            cfs.Add(cf);
 
            CardFunding cf1 = new CardFunding();
            cf1.CardID = 1;
            cf1.RemainingBalance = 3;
            cfs.Add(cf);
            return Json(cfs, JsonRequestBehavior.AllowGet);
        }

The server-side code gets called and returned, and no execptions are tripped anywhere there or in the .js.
Any help greatly appreciated.

Kendo team: Awesome job on the project. Looking forward to mastering your framework.

Hi
I am trying to make a basic datasource integration and populate a grid with data.
My RST service delivers JSON in this format

This is how I try to setup the datasource and Grid:

I can see the GET request being carried out in FireBug, but the Grid remains empty.
Any suggestions?

I have one further question:
Is it possible to omit the data parameter, and leave out the "root" element?
I would like to be able to read json like this:


/Thomas

Hi,
I have a problem in binding JSON data with Kendo Pie Chart.
I have data source where I have supplied the url of my service with method name, that is getting me the data from server. I can see the data is returning from the server when I paste that url in my firefox  browser. I am also supplying the field name to the grid but not getting my chart displayed. It works fine when i supply hard coded array to it.
Could please anyone help me? Following is the code

    <div id= "kendoChart" style="width:50%; float:right; height:450px; margin-top:-20"></div>
    <script type="text/javascript">
        //var rtData = [3, 15, 30, 45, 92];
        var chartDataSource = new kendo.data.DataSource({
            transport: {
                read: {
                    url: "/DomainService/ContactedChartDomainService.svc/json/GetContactedChartViews",
                    dataType: "json"
                },
                schema:
                        {
                            data: "GetContactedChartViewsResult.RootResults"
                        }
            }
                });

        $(function () {
            $("#kendoChart").kendoChart({
                dataSource: chartDataSource,
                title: { text: "Stats" },
                seriesDefault: {
                    type: "pie"
                },
                series: [
                {
                    field: "Occurances",
                    categoryField: "ContactedName"
                    //type: "pie"
                }],

                tooltip: {
                    visible: true
                }
            });
        });
    </script>
    </div>

my JSON out put is as follow
{"GetContactedChartViewsResult":{"TotalCount":3,"RootResults":[
{"ContactedID":1,"ContactedName":"No","Occurances":5},
{"ContactedID":2,"ContactedName":"Under Consideration","Occurances":1},
{"ContactedID":3,"ContactedName":"Follow Up","Occurances":11}]}}

Kind Regards,
Waseem

Hi,

I'm just wondering on the best way of doing this. I have a scenario where I need to go back into a screen and edit details in which a file has been uploaded using a Kendo Uploader. Now, obviously upon editing this, the file needs to be displayed (and the remove icon showed) when the user goes back to the screen.

Is there a way of telling the Uploader to pre-load files (I'm guessing using file name + id) so I can achieve my goal here?

Any help would be greatly appreciated.

What I want to achieve is, while having a grid with one of the columns named "Priority" set to integer, is whenever I change that row value to update all the "priority" values in the other rows to match the new change. Can this be done on key press or loose focus?

example:
having:

3,
1,
2,

If i change the value 1 to 2: the values should update to:

3,
2,
1

Thanks