Questions on Kendo UI for jQuery Forum

7 answers

239 views

[Solved] Errors in grid sorting and grouping with XML data source

I've reproduced a problem I'm seeing in my own application by modifying the Data Source > Binding to XML example to use a grid for rendering rather than a template, as shown in the code below. Except for specifying an original sort order, the data source is unchanged. I've configured the grid to allow grouping and sorting. However, whenever I attempt to either group or sort, I get

Error: Unable to get value of the property 'book': object is null or undefined

The debugger call stack indicates that the error is occurring in an "evaluate" method in kendo.data.xml.min.js. (I have the trial version, so can't inspect the source code further.)

Additionally, my original sort order is not being respected; the grid loads unsorted.

Are these bugs mine or the framework's?

<div id="grid"></div>

<script>

$(document).ready(function() {

var element = $("#grid").kendoGrid({

dataSource: {

transport: {

read: "books.xml"

},

schema: {

type: "xml",

data: "/books/book",

model: {

fields: {

title: "title/text()",

author: "author/text()",

url: "url/text()",

cover: "@cover"

}

},

sort: { field: "title", dir: "asc" }

}

},

columns: [ "title", "author", "url" ],

groupable: true,

sortable: {

mode: "single",

allowUnsort: false

}

});

</script>

Grid

answered on 23 Jan 2012

1 answer

124 views

Collapse glitch?

In the Feed Reader demo by Todd, collapsing the Feed list using the vertical splitter's collapse feature. The right pane turns all screwy and doesn't resize correctly.

Check it out here : http://htmlui.com/demos/kendo/feedreader/index.html

I've attached a screenshot of what it looks like.

Splitter

answered on 23 Jan 2012

2 answers

223 views

[Solved] Filtering OData

I'm using the inbuild function of the grid to do filtering via OData source.

When I try to filter a numeric value, I get this error from the odata service:

Operator 'eq' incompatible with operand types 'System.Int32' and 'System.String' at position 5.

Is there a way to configure the filter expression?

Thanks
Eric

Data Source

answered on 23 Jan 2012

2 answers

196 views

[Solved] Grouping with OData and WCF

Does grouping work with OData and specially WCF?(servergrouping = true)?

If yes, what would be the correct configuration for the grid?

Thanks
Eric

Grid

answered on 23 Jan 2012

6 answers

461 views

[Solved] posting json creates urencoded string results in 400 bad request

Hi,
I'm trying to post pure json data this way:
create: {
url: crudServiceBaseUrl,
dataType: "jsonp",
contentType: "application/json",
type: "POST"
},
parameterMap: function (options, operation) {
if (operation !== "read" && options) {
return { models: kendo.stringify(options) };
}
}
}
batch:false

(I use 'options' instead of 'options.models' since I'm not using batch post)

but the post is not formatted correctly. If I look at the request payload (in chrome dev tools) it says
models=%7B%22Id%22%3Anull%2C%22Content%22%3A%22somecontent%22%2C%22Order%22%3A0%2C%22Done%22%3Afalse%7D

which the server does not like and responds with 400 bad request

however, if I add my own jQuery.ajax function like this:

$.ajax({
type: 'POST',
url: '/api/todos',
data: kendo.stringify(options),
contentType: 'application/json',
dataType: 'jsonp',
success: function (data) {
_resData = data;
},
async: false
});

the request is ok:
{"Id":null,"Content":"somecontent","Order":0,"Done":false}

and the server responds OK

What am I doing wrong?
Thanks

Grid

answered on 23 Jan 2012

1 answer

145 views

multiple datasource

I'm using a tabstrip with two grids.
Both are using a datasource, bound to the same OData service, but different entities.

When I add the second datasource, the data isn't bound anymore to the grids.
One grid alone works.

Isn't it allowed to have two different datasources?

PS: Please check your demos. Which is the correct type and format for templates?

text/x-kendo-templ

or

text/x-kendo-template ?

You find boths.

Thanks
Eric

(Kendo UI v2012.3.111)Kendo UI v2012.3.111

Grid

answered on 23 Jan 2012

1 answer

111 views

No Empty Message property on the AutoComplete control

What happened to this property? It was very useful in the Ajax Controls suite.

AutoComplete

answered on 23 Jan 2012

1 answer

159 views

Providing feedback on internal builds

I downloaded the latest internal build 2012.3.111 to get support for the DropDownList as an editor for the grid and for the Add New Record to an empty grid bug fix. The DropDownList column Editor works fine in IE9 but not at all in Chrome (version 16.0.912.75 m). Also I have navigatable commented out because the DropDownList does not work in any browser when keyboard navigation is turned on. I've verified that the DropDownList works properly outside of the grid on both browsers.

I wanted to open a support ticket but there's no option for anything but publicly released builds. Is there a bug tracker for internal builds so that we can provide feedback?

       $('#contacts').kendoGrid({
            scrollable: true,
            dataSource:contacts,
            sortable: true,
            //navigatable:true,
            autobind:true,
            pageable: true,
            selectable: "single",
            toolbar: ["create", "save", "cancel"],
            editable: true,
            columns:[
            {
                field:"ContactRoleType",
                title:"Contact Type",
                editor: ContactTypeEditor
            },
            {
                field:"FirstName",
                title:"First Name"
            },
            {
                field:"LastName",
                title:"Last Name"
            },
            {
                field:"EmailAddress",
                title:"Email Address"
            },
            {
                field:"CountryName",
                title:"Country"
            },
            {
                field:"PhoneNumber",
                title:"Phone"
            },
            {
                field:"FaxNumber",
                title:"Fax"
            },
            {
                field:"Comments",
                title:"Comments"
            },
            {
                command:"destroy",
                title:""
            }]
        });
    });
    function ContactTypeEditor(container, options) {
    $('<input name="' + options.field + '"/>')
                        .appendTo(container)
                        .kendoDropDownList({
                            dataSource: {
                                transport: {
                                    read: {
                                        url: "@Url.Action("ContactTypes","Contacts",new {Area="CRM"})",
                                        dataType: "json",
                                        contentType: "application/json; charset=utf-8",
                                    }
                                }
                            },
                            dataTextField:"Text",
                            dataValueField:"Text",
                            autoBind: true
                        });
     }

Grid

answered on 23 Jan 2012

5 answers

252 views

[Solved] Binding to WCF Data Service produces an Error:

Any Ideas why the following code should produce an error?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
    <head>
    <!--In the header of your page, paste the following for Kendo styles-->
    <link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
    <link href="styles/kendo.kendo.min.css" rel="stylesheet" type="text/css" />
    <!--Then paste the following for Kendo scripts-->
    <script src="scripts/jquery.min.js" type="text/javascript"></script>
    <script src="scripts/kendo.all.min.js" type="text/javascript"></script>


        <title>Binding to remote data</title>
    </head>
    <body>
        <div id="example" class="k-content">
            <div id="grid"></div>
            <script  type="text/javascript">
                var dateRegExp = /^\/Date\((.*?)\)\/$/;

                function toDate(value) {
                    var date = dateRegExp.exec(value);
                    return new Date(parseInt(date[1]));
                }

                $(document).ready(function () {
                    $("#grid").kendoGrid({
                        dataSource: {
                            type: "odata",
                            transport: {
                                read: "http://localhost:64526/WcfLeaguesDataService.svc/tbl_Umpires"
                            },
                            schema: {
                                model: {
                                    fields: {
                                        Id: { type: "number" },
                                        Firstname: { type: "string" },
                                        LastName: { type: "string" },
                                        EmailAdd: { type: "string" }
                                    }
                                }
                            },
                            pageSize: 10,
                            serverPaging: true,
                            serverFiltering: true,
                            serverSorting: true
                        },
                        height: 250,
                        filterable: true,
                        sortable: true,
                        pageable: true,
                        columns: [{
                            field: "Id",
                            filterable: false
                        },
                            "Firstname", 
                            "LastName",
                            "EmailAdd"
                        ]
                    });
                });
            </script>
        </div>
    </body>
</html>

The Error is:

<?xml version="1.0" encoding="iso-8859-1" standalone="yes"?>
<error xmlns="http://schemas.microsoft.com/ado/2007/08/dataservices/metadata">
  <code></code>
  <message xml:lang="en-GB">The query parameter '$format' begins with a system-reserved '$' character but is not recognized.</message>
</error>

As it is just an edit of the Example code. (The WCF string pasted into the browser, seems to work fine)