Questions on Kendo UI for jQuery Forum

0 answers

462 views

How to bind the json data returned from .ashx file to DataSource?

When I created a grid, I tried to use a .ashx file as a datasource. No data displayed in IE.
But when I save the .ashx result as a .json file and bind to the datasource. Grid displyed ok.
Please help to find what is wrong with my code? Thank.
internet-users.json :
[{"Name":"System","Role":"a","Birthdate":"\/Date(259074000000)\/","ID":3},{"Name":"Moataieh","Role":"CHASSIS INSTALLATION","Birthdate":"\/Date(259074000000)\/","ID":26}]

My JsonDataSrc.ashx is:
I ran it in IE and IE displayed the same data as in internet-users.json

<%@ WebHandler Language="C#" Class="GetData" %>

using System;

using System.Web;

using System.Data.SqlClient;

using System.Data;

using System.Collections.Generic;

using System.Web.Script.Serialization;

public class GetData : IHttpHandler

{

public void ProcessRequest(HttpContext context)

{

string connectionString = @"Data Source=.;Initial Catalog=MyData;User ID=MyData;Password=;";

context.Response.ContentType = "text/plain";

List<Person> list = new List<Person>();

using (SqlDataReader sdr = StockIMS.IDataAccessLayer.SqlHelper.ExecuteReader(connectionString, CommandType.Text,

"SELECT top 2 isnull(Name,''), isnull([Job Role],'N/A') role,  isnull(Birthday,'1972-01-01'), [Person ID] id FROM [Staff Names]"

))

{

while (sdr.Read())

{

Person Personitem = new Person();

Personitem.Name=sdr[0].ToString();

Personitem.Role=sdr[1].ToString();

try

{

Personitem.Birthdate = Convert.ToDateTime(sdr[2].ToString());

}

catch { }

Personitem.ID =Convert.ToInt32( sdr[3].ToString());

list.Add(Personitem);

}

sdr.Close();

}

context.Response.Write(new JavaScriptSerializer().Serialize(list).ToString());//转为Json格式

}

public bool IsReusable

{

get

{

return false;

}

public class Person

{

private System.String _Name;

private System.DateTime _Birthdate;

private System.Int32 _ID;

private System.String _Role;

public Person()

{

}

public string Name { get { return _Name; } set { _Name = value; } }

public string Role { get { return _Role; } set { _Role = value; } }

public DateTime Birthdate { get { return _Birthdate; } set { _Birthdate = value; } }

public Int32 ID { get { return _ID; } set { _ID = value; } }

}

My index.html is:

<!DOCTYPE html>

<html>

<head>

<title>Basic usage</title>

<link href="../content/shared/styles/examples-offline.css" rel="stylesheet">

<link href="../styles/kendo.common.min.css" rel="stylesheet">

<link href="../styles/kendo.default.min.css" rel="stylesheet">

<script src="../js/jquery.min.js"></script>

<script src="../js/kendo.web.min.js"></script>

<script src="../content/shared/js/console.js"></script>

<script src="../content/shared/js/people.js"></script>

<style >

body { font-size: 9pt; }

#dvGrid { width: 500px; }

span.hi-lite { color: red; }

#dvGrid th.k-header { text-align: center }

</style>

</head>

<body>

<a class="offline-button" href="index.html">Back</a>

<div id="example" class="k-content">

<div id="clientsDb">

<div id="dvgrid" style="height: 380px"></div>

</div>

<script>

$(document).ready(function() {

var dataSrc = new kendo.data.DataSource(

{

transport:

{

read: {

type:"POST",

url: "internet-users.json",// "JsonDataSrc.ashx",

dataType: "json"

}

},

pageSize: 10,

serverPaging: true,

serverSorting: true

});

var dateRegExp = /^\/Date$(.*?)$\/$/;

window.toDate = function (value)

{

var date = dateRegExp.exec(value);

return new Date(parseInt(date[1]));

}

function createGrid() {

$("#dvgrid").kendoGrid

({

dataSource: dataSrc,

autoBind: false,

sortable: {

allowUnsort: false

},

columns: [ {

field: "Name",

width: 90,

title: "Name"

} ,{

width: 100,

field: "Role"

} , {

field: "Birthdate",

title: "Birth Date",

template: '#= kendo.toString(toDate(Birthdate), "yyyy/MM/dd")#'

} , {

width: 50,

field: "ID"

}

]

}) ;

}

createGrid() ;

dataSrc.read();

});

</script>

</div>

</body>

</html

Data Source

asked on 14 Nov 2012

0 answers

144 views

Change/Highlight Rows in grid

Hello,

I have this scenario that user can highlight certain rows with different selectable colours and these colours must be stored in some db so that when user come again the particular row will show in the very same colour that he has selected earlier.

Thanks in advance

Grid

asked on 14 Nov 2012

0 answers

176 views

Multiple Columns Sorting

Hello,

I have to add multiple column sorting in kendo grid. Let me explain a little bit more for example I have 4 columns in a grid Column Column B, Column C and Column D. Now if user sort grid with column A and then he select to sort grid with column B then the grid should be sort as AB.

I hope I deliver my question.

Thanks in advance.

Grid

asked on 14 Nov 2012

1 answer

430 views

Template Default: "This template is empty"

I am trying to create a template that will read "This template is empty" when the data source is an empty array. Currently, my div is bound to the data source as follows:

<div data-bind="source: data"></div>

I have tried a number of different things including writing a function that returns an object that represents the data source I'm interested in:

function() {
var data = this.data;
if (data.length == 0) {
return [ { dataValue: "This template is empty." } ];
}
else {
return data;
}
};

How would I accomplish this? Thanks in advance.

Templates

answered on 14 Nov 2012

0 answers

122 views

Kendo Templates and W3C Validation

Hi I have a number of templates on my website and have been asked to run the site through the W3c validator. I am still using XHTML 1.0 Transitional but the validator is throwing up a number of errors. The notable ones are "document type does not allow element "div" here" and "ID "myID" already defined". I know that the page works fine with these inside my template and I don't much mind that they are there but from a client point of view I cannot get rid of the errors from the page.

Has anyone come up with a way to escape the template scripts from the page so they don't appear in validation while still allowing the template to work correctly?

An example of one of my templates:

<script type="text/x-kendo-template" id="clickTemplate">

<div class="resultLine" onclick="window.location = '${ data.oDataSourceURL }'">

<a href="${ data.oDataSourceURL }">${data.oDataProductDesc}</a>

</div>

</script>

Thanks in advance

Jamie

Templates

asked on 14 Nov 2012

1 answer

363 views

Kendo Chart - Get object of active chart

Hi,

I have three chart with different ids in a page. At a time only one chart will be enabled and others are disabled.
My requirement is how to get the clientside object of enabled chart. Chart has created using the kendo helper class.
Please help me how to solve this issue.

Charts

answered on 14 Nov 2012

1 answer

181 views

treeview.collapse() removes child nodes if they had not been expanded

It seems if you use collapse() on nodes that have not yet been expanded than you will make those child nodes dissapear.

You can reproduce this on the TreeView / API demo page:

1) open http://demos.kendoui.com/web/treeview/api.html
- notice that "Item 2" is collapsed.
2) Click on the "Collapse All nodes" button
- notice that "Item 1" is collapsed
3) Click on "Item 2" in the tree
- notice that it will not expand.
- notice that clicking on "Item 1" will expand
4) Now refresh the page (http://demos.kendoui.com/web/treeview/api.html)
5) This time, Click on "Item 2" in the tree to expand it.
6) Click on the "Collapse All nodes" button
- notice that "Item 2" is collapsed
7) Click on "Item 2"
- notice that it expands.

TreeView

answered on 14 Nov 2012

1 answer

195 views

DataSource support for OData v3 any/all?

I'm using the Grid control with an OData DataSource. I'd like to be able to add filters that use OData v3's any/all capabilities. I am okay with creating the filters outside the grid, but I am unsure how I can add them to the DataSource's filter array. It doesn't seem that the standard { field: 'foo', operator: 'eq', value:'bar' } filters will work in this scenario. The filter that I need to add needs to generate a string like "Foos/any(f: substringof('bar', f/Name) eq true)" as part of the OData url's filter parameter.

Data Source

answered on 14 Nov 2012

8 answers

1.4K+ views

Does the Kendo UI Grid support Column Header Templates?

I've been reading through the documentation and I've been unable to find a definitive answer on this.

Does the Kendo UI grid support column header templates?

We need to put a custom totals div into column headers on certain columns so we can update them on the fly as the data changes.

Grid

answered on 14 Nov 2012

1 answer

822 views

Creating a Custom command button and passing parameters

I'm trying to create a custom command button to fire a custom delete function. I need to pass the ID of my model to my custom delete function. You'll notice that I'm trying to pass in a static '5' as a test but that isn't working either.

Any help would be greatly appreciated.

@(Html.Kendo().Grid(Model)

.Name("Grid")

.Columns(columns =>

{

columns.Bound(p => p.Name).Width(240);

columns.Bound(p => p.City).Width(170);

columns.Bound(p => p.State).Width(170);

columns.Command(command =>

{

command.Edit();

command.Custom("Delete").Click("PropertyPage.DeleteProperty").HtmlAttributes(new { @Id = 5 });

}).Width(166);