Questions on Kendo UI for jQuery Forum

4 answers

795 views

DataSource with Local JSON File not loading in Grid

I am really struggling with this. I have tried looking at every forum example and made sure that I have the right code and the right format for the JSON file, but I cannot get the grid to show anything but the column headers.

Any help would be appreciated.

Thanks,
Brian

Data Source

answered on 06 Oct 2012

0 answers

148 views

Binding Checkbox

I have one dropdwonlist in my view i want to when change dropdownlist list many checkbox and id change again save the state

Roles:<select id="roles" data-bind="source: roles, value: role" data-text-field="roleName" data-value-field="roleId" ></select>

</div

>

 $(document).ready(function() {

            var viewModel = kendo.observable({

                roles: [  {

                    roleName:"Admin",

                    roleId:1

                },

          {

              roleName:"user",

              roleId:2

          }],

                Accesses:[{

                    accssesName:"read",accessMode:true},

                    {accssesName:"Write",accessMode:false},

                       {accssesName:"Delete",accessMode:false}

                ]

                

            });



            kendo.bind($("#example"), viewModel);

            var roles=[

                {

                    roleName:"Admin",

                    roleId:1

                },

                 {

                     roleName:"user",

                     roleId:2

                 }

            ];

            var roledataSource=  new kendo.data.DataSource({

                roles:roles

            });

        });

MVVM

asked on 06 Oct 2012

4 answers

213 views

Controlling if links/buttons use ajax or just goes to the page.

Hi,

So I've just started using the UI, but I've used the Jquery mobile one before. Features I liked that I can't find is:

Go to an another page.
Page 1 url: /home
Page 2 url: /search

and NOT
url: /#/search

I don't want the ajax calls to happen. I like them don't get me wrong but the next page does it's own stuff.

can you add the feature of "data-ajax=false" or "rel=external". Something so we can move to the next page and not load within.

Thanks

General Discussions

answered on 06 Oct 2012

12 answers

697 views

[Solved] Window created by script from script file not getting data object

Hi,

I used a script file (xxx.js) where i created a div with id = "#divid" and then created the window. I added this script file to my page in head tag. Now if i try to access the div with id "#divid" i am able to access it but if i try to access

$(

'#divid')..data("kendoWindow"), it is giving null error. if i create the kendo window in the page itself in a script tag, iam able to access the data object but if i do the same in seperate js file, i am not able to. Is there any problem with this type of creating? Please help me out. Following is code snippet in my .js file.

$(

'[data-class=MyModal]').click(openmodal);

function openmodal(event) {

var dialog = $('#divid');

debugger;

if (dialog.length == 0) {

dialog = $(

'<div id="divid" style="display:none"></div>').appendTo('body');

}

dialog.kendoWindow({

modal:

true,

title: "Some Title"

,

actions: [

"Close"],

draggable: true

,

resizable: true

,

height: "400px"

,

width: "400px"

,

content: "myurlofsomepagewithinsamedomain",

});

dialog.data(

"kendoWindow").center();

dialog.data(

"kendoWindow").open();

}

event.preventDefault();

}

Window

answered on 05 Oct 2012

5 answers

1.1K+ views

Sencha or Kendo???

Hello!
I have to make a choice on a HTML5 framework to use , to build a similar Desktop application and mobile application in which I can manage several sub-applications.
I am trying to understand which is the 'best' framwork between Sencha Extjs 4 and Kendo UI.

Because I am new to this world I want to ask you which are the teknical quality of the two frameworks and why I have to choose one or the other.

I have use Extjs 4 and I like it ,i am not for one or for the other but I am only asking which differences there are between them.

I wait for some answer.

Thanks a lot.

General Discussions

answered on 05 Oct 2012

3 answers

2.1K+ views

[Solved] The grid does not render correctly unless the containing element is visible at initialization time

If you call .kendoGrid(options) on an element that is not "on screen" (e.g. display: none) it does not render and function correctly.

In particular the height, scrollbars and reorderable properties do not result in expected functionality.

The following fiddle shows expected and unexpected behaviors - via the use of a bootstrap tab control.

Tab 1 - works as expected as this tab is visible on screen when the .kendoGrid(options) js call is made.

Tab 2 and 3 - do not work as expected as they are not on-screen when the .kendoGrid(options) js call is made.

You cannot re-order the columns via drag n drop.
The scroll bars extend past the height set for the grid.

(It's easier to see the the scroll bar rendering issues if you are not on a mac with on-demand scrollbars)

http://jsfiddle.net/YNdAJ/3/

The immediate work around is to call .kendoGrid(options) the first time each tab is displayed on screen however there is a significant delay while this processing occurs and I'd rather have all that happen at a different stage of the page load lifecycle.

Is this a bug? If not, is there a better way to achieve what I'm looking for?

Grid

answered on 05 Oct 2012

0 answers

148 views

How to EXPAND to a subnode (from a DATAITEM)?

I have a data item 4-ish levels deep. Need to EXPAND to and SELECT it. Tree is collapsed.
FindByUID fails because uids of dataitems do not match uids of LI's [don't know why].
FindByText presents too many options as there are multiple children with the same names.

I'm already scrolling upward dataitem to dataitem.parent() to the top. So I have those. But HOW do you get the SINGULAR LI which matches that dataitem in order to expand/select????

TreeView SHOULD have an .expand(dataitem) override which does this.

TreeView

asked on 05 Oct 2012

1 answer

207 views

Kendo Ui controls or Telerik controls for MVC4

Hello All,
We are going to develop our application using MVC4 , Single Page Application(SPA). with Razor engine.
But need help on controls to use. Our application uses Autocomplete, Dropdown, TreeView, Grid controls. There are KenDo ui controls we can use. But there are some limitations with control like TreeView (We can't use Remote Datasource in current version)
I also submitted post related to that but not get any reply.

So we looked in to Telerik controls for Asp.net mvc
http://demos.telerik.com/aspnet-mvc/

So can anybody tell that is it better if we can use those Telerik controls in our application. Or if used what can be drawbacks we may face.

Our Application Specifications
ASP.NET 4.5 (MVC4)
Razor engine

Please give suggestion so that we can proceed with any of the controls among those

Thanks,
Atul

General Discussions

answered on 05 Oct 2012

0 answers

109 views

Just Another Grid Event Remove (JAGER) Question

Can anyone help: Why doesn't this fire the remove event in the grid?

$("#grid").delegate("#deleteItem", "click", function(e) {

var grid = $('#grid').getKendoGrid();

var a = grid.dataItem($(this).closest('tr'));

grid.removeRow(a);

});

Full Example:
http://jsfiddle.net/bGR88/9/

Thanks

Grid

asked on 05 Oct 2012

1 answer

153 views

Why doesn't JSON from my service appear in my grid?

I'm attempting to populate the Kendo UI Grid with JSON returned from my web service (ASP.NET Web API). The JSON appears valid, confirmed valid by running the entire return through JSONLint.com.

Here is a sample from the service:

[{"Id":2000,"Name":"Alabama"},{"Id":2001,"Name":"Alaska"},{"Id":2002,"Name":"Arizona"}]

The problem is, the data returned from the service does not display in the grid. If I comment out the call to the service and use the array created below, the grid is populated. What's going on and how do I fix it?

The code below is my entire demo page.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Basic Grid usage</title>
    <link href="content/kendo/2012.2.710/kendo.common.min.css" rel="stylesheet" type="text/css">
    <link href="content/kendo/2012.2.710/kendo.default.min.css" rel="stylesheet" type="text/css">
    <script src="scripts/kendo/2012.2.710/jquery.min.js" type="text/javascript"></script>
    <script src="scripts/kendo/2012.2.710/kendo.web.min.js" type="text/javascript"></script>
</head>
<body>
 
    <div id="states">
    </div>
    <script type="text/javascript">
 
        $(document).ready(function () {
 
            var states = [
                    { Id: 1, Name: "Maine" },
                    { Id: 2, Name: "Washington" },
                    { Id: 3, Name: "Idaho" }
                ];
 
            var statesDataSource = new kendo.data.DataSource({ data: states });
 
//            var statesDataSource = new kendo.data.DataSource({
//                transport: {
//                    read: {
//                        url: "http://XXX.com/apps/states",
//                        dataType: "jsonp"
//                    }
//                }
//            });
 
            statesDataSource.read();
 
            $("#states").kendoGrid({
                dataSource: statesDataSource
            });
        });
    </script>
</body>
</html>

Grid

answered on 05 Oct 2012